I am fetching data from an API and displaying it in a html table.
Now I want to change the color of the rows based on the value of a column.
For example if status is Accepted then green row and if status is not accepted then red color row.
<div class="container"></div>
<table class="table">
<thead>
<tr>
<th>Name</th>
<th>Address<br>Status</th>
<th>Status<br>Status</th>
</tr>
</thead>
<tbody id="data">
</tbody>
</table>
</div>
<Script>fetch("some url").then(
res => {
res.json().then(
data => {
console.log(data.data);
if (data.data.length > 0) {
var temp = "";
data.data.forEach((itemData) => {
temp += "<tr>";
temp += "<td>" + itemData.Name + "</td>";
temp += "<td>" + itemData.Address + "</td>";
temp += "<td>" + itemData.Status + "</td></tr>";
});
document.getElementById('data').innerHTML = temp
}
}
)
}
)
</script>