Javascript 在单击某一行时更改该行的颜色

我正在动态创建一个html表，如下所示：

var table = document.getElementById("mytable"); 
            var rowcount = document.getElementById("mytable").rows.length;      
            var row = table.insertRow(rowcount);            
            var cell1 = row.insertCell(0);
            var cell2 = row.insertCell(1);
            var cell3 = row.insertCell(2);
            var cell4 = row.insertCell(3);
            var cell5 = row.insertCell(4);

            cell1.innerHTML = rowcount;
            cell2.innerHTML = "a";
            cell3.innerHTML = "b";
            cell4.innerHTML = "c";
            cell5.innerHTML = document.getElementById("select_product_name").value;

行中的最后一列，即

cell5

，其中包含

id

我想要一个这样的函数，即在表中单击一行应该得到id，即

cell5的值，并且整行应该变为红色。

注意：只使用Javascript，不使用jQuery

它正在部分工作。如何改变颜色<代码>row.className+=“红色”不起作用我知道了，伙计。所以你的意思是红色是一种阶级！！是的，
red
是一个CSS类。你只需要写一些CSS来改变行的颜色。好的，伙计，我知道了。谢谢
var table = document.getElementById("mytable"); 
var rowcount = document.getElementById("mytable").rows.length;      

var row = table.insertRow(rowcount);            
var cell1 = row.insertCell(0);
var cell2 = row.insertCell(1);
var cell3 = row.insertCell(2);
var cell4 = row.insertCell(3);
var cell5 = row.insertCell(4);

cell1.innerHTML = rowcount;
cell2.innerHTML = "a";
cell3.innerHTML = "b";
cell4.innerHTML = "c";

var id = document.getElementById("select_product_name").value;
cell5.innerHTML = id;

row.onclick = function() {
    // Add a css class to the row
    row.className += ' red';

    // Alert the id
    alert(id);
};