title: javascript-single onclick event to highlight cells in different tables
body: <p>i have a requirement to highlight cells in different tables <strong>which are created dynamically</strong>. i have created tables and now looking the same to highlight with some condition. my code look like as follows,</p>
  
  <pre><code>        &lt;script type="text/javascript"&gt;
          function compare()
                   {
  
                  var rows =document.getElementsByClassName('highlight').tBodies[0].rows, numOfRows = rows.length;
  
  
                   for (var i = 0; i &lt; numOfRows ; i++)
                   {
                   if(rows[i].cells[1].innerHTML !== rows[i].cells[2].innerHTML )
                          {
  
                            rows[i].className='rowChange';
                           rows[i].cells[1].className = 'cellChange';
                            rows[i].cells[2].className = 'cellChange';
                          }}
      }
          &lt;/script&gt;
  
      &lt;body&gt;
  &lt;div&gt;&lt;input type="button" value="highlight" onclick="compare" /&gt;&lt;/div&gt;
         &lt;table id='main'&gt;
           &lt;tr&gt;
              &lt;td&gt;table1&lt;/td&gt;
              &lt;td&gt;&lt;table class='highlight' id='child1'&gt;&lt;tr&gt;&lt;td&gt;test1&lt;/td&gt;&lt;td&gt;test2&lt;/td&gt;&lt;td&gt;test3&lt;/td&gt;&lt;/tr&gt;&lt;/table&gt;&lt;/td&gt;
           &lt;/tr&gt;
  
           &lt;tr&gt;
              &lt;td&gt;table2&lt;/td&gt;
              &lt;td&gt;&lt;table class='highlight' id='child2'&gt;&lt;tr&gt;&lt;td&gt;test2&lt;/td&gt;&lt;td&gt;test2&lt;/td&gt;&lt;td&gt;test2&lt;/td&gt;&lt;/tr&gt;&lt;/table&gt;&lt;/td&gt;
           &lt;/tr&gt;
  
             ----
             ----
            ----
           &lt;tr&gt;
              &lt;td&gt;table'n'&lt;/td&gt;
              &lt;td&gt;&lt;table class='highlight' id='childn'&gt;&lt;tr&gt;&lt;td&gt;test'n'&lt;/td&gt;&lt;td&gt;test'n'&lt;/td&gt;&lt;td&gt;test'n'&lt;/td&gt;&lt;/tr&gt;&lt;/table&gt;&lt;/td&gt;
           &lt;/tr&gt;
  &lt;/table&gt;
  
  &lt;/body&gt;
  </code></pre>
  
  <p>if i highlight using 'id' attribute that's working fine. but it's making code to be too complex. so please suggest me to me meet my goal efficiently. thanks in advance. </p>