Get <table> element's nth <td> innerHTML dynamically

Question

Is there anyway I can get the innerHTML of the designated n^th <td> in a <table> using JavaSCript?

Since my table is automatically generated, my <td>'s do not have IDs. I am using the following HTML code:

<table id="table">
  <tr>
    <td onmouseover="myTD()">Cell 1</td>
    <td onmouseover="myTD()">Cell 2</td>
    <td onmouseover="myTD()">Cell 3</td
  </tr>
  <tr>
    <td onmouseover="myTD()">Cell 4</td>
    <td onmouseover="myTD()">Cell 5</td>
    <td onmouseover="myTD()">Cell 6</td>
  </tr>
</table>

But how do access, for instance, Cell 5?

Thanks a lot!

Answer 1

var cells = document.getElementById('table').getElementsByTagName('td');

This will contain all your table cells. Use array notation to access a specific one:

cells[4]

Here's a quick demo which changes the background color:

http://jsfiddle.net/jackwanders/W7RAu/

Answer 2

Not sure what you want - Dom: document.getElementsByTagName("table")[0].rows[2].cells[1]