Fetch All td from table and add events dynamicly with JavaScript No jQuery

Table

  <table  border="1" cellpadding="0" cellspacing="0" width="600px" >
   <tbody class='tbodyClass'>
 
      <tr>
         <td id="a" class="a">
         AAAAAAAA
         AAA
         aAA
         </td>
         <td class="b"></td>
      </tr>
        <tr>
         <td id="b" class="a">
         BBB  <br />
         BBB<br />
         BBB<br />
         </td>
         <td class="b"></td>
      </tr>
        <tr>
         <td   id="c"  class="a">
         CCC<br />
         CCC<br />
         CCC<br />
         </td>
         <td class="b"></td>
      </tr>
        <tr>
         <td   id="d"  class="a">
         DDD<br />
         DDD<br />
         DDD<br />
         </td>
         <td class="b"></td>
      </tr>
       </tbody>
   </table>

Script

 <script type="text/javascript">

      function clickCellTest() {
         alert(this.id);
      }
      window.onload = function MaheshTest() {
         var ab = document.getElementsByClassName('tbodyClass')[0];

         ab = ab.getElementsByTagName('td');
         for (var i = 0; i < ab.length; i++) {
            var element = ab[i];
            element.addEventListener("click", clickCellTest, false);
         }
      }

   
   </script>