Question

I try to change the background of rows in my table with JavaScript but it’s not working.
This is my code. However I tried to create a table with html and its work.
P.S : I want to use webkit.

Code :

var table = document.getElementById("tab");
var rowCount = table.rows.length;


for(var i=0;i<6;i++) {     
   row = table.insertRow(rowCount);
   row.id = "row"+i;
   cell1 = row.insertCell(0);
   var content = document.createElement("output");                
   content.innerHTML = i ;
   cell1.appendChild(content);
   rowCount++;
}


 $(document).ready(function(){
        $('td').each(function(i) {     
             $('#tab').on('click', '#row'+i, function(){
                document.getElementById("row"+i).style.background = 'white';
                 //alert(i);
             });   
        });   

     //example2
     $('#td1').on('click', function(){
                document.getElementById("td1").style.background = 'white';
             });   
 }); 

Answer 1

The issue you’re running into is because you are setting the background gradient on the TD, then setting the background color of the TR. Since the TD is within the TR, you’re just not seeing your change be applied.