Color Row Based On Cell Value

I have a table with a particular column, where the cells only contain either 'R' , 'N' or 'Y'. I want to color the row based on either of those values mentioned. Any advice would b

Solution 1:

Works in Firefox on Ubuntu: jsfiddle

p.s. Should be an else-if. If the text inside is 'R', then you should not evaluate for 'Y'.

var rows = document.getElementById("trans_separate").getElementsByTagName("tbody")[0].getElementsByTagName("tr");

for (i = 0; i < rows.length; i++) {
    row = rows[i].getElementsByTagName('td');
    var cell = getText(row[0]);
    if (cell === 'R') rows[i].className = "red";
    else if (cell === 'Y') rows[i].className = "yellow";
}

function getText(cell) {
    return (cell.innerText == undefined) ? cell.textContent : cell.innerText;
}

Solution 2:

Working example:

var rows = document.getElementById("trans_separate").getElementsByTagName("tbody")
  [0].getElementsByTagName("tr");

    // loops through each row
    for (i = 0; i < rows.length; i++) {cells = rows[i].getElementsByTagName('td');

            if (cells[0].innerHTML == 'R')
                rows[i].className = "red";

            if (cells[0].innerHTML == 'Y')
                rows[i].className = "yellow";           
 }

http://jsfiddle.net/mMFwQ/4/