Accessing table cell data within list items with javascript

[Piggo]

I'm creating a list dynamically and I need to be able to retrieve values from the table cells. The structure is:

<ul id="tester">
<li><div><table><tr><td></td><td id="samecellid">I WANT THIS TD VALUE..
<li><div><table><tr><td></td><td id="samecellid">I WANT THIS TD VALUE..
<li><div><table><tr><td></td><td id="samecellid">I WANT THIS TD VALUE..

Each list item <li> has a table within it - this table only has one row, so the td id is unique within each list item but not within the list as a whole obviously.

The problem I have is I can't seem to get the value of the td cell. I have tried several ways, this is my latest and it doesn't work:

if (lengthoflist > 0) {
for (k=1; k<=lengthoflist; k++){

var ul = document.getElementById("tester");
var mya = ul.getElementsByTagName("li")[k];
var myb = mya.getElementsByTagName("div");
var myc = myb.getElementsByTagName("table");
var myd = myc.getElementsByTagName("tr");
var mye = myd.getElementById("samecellid");

var celldata = mye.innerHTML;
}
}

Thanks for any advice on this.

[penders]

... the td id is unique within each list item but not within the list as a whole obviously.

But this is invalid HTML. The ID must be unique in the document. The getElementById() method only exists on the document object, therefore this ID cannot be used. (Some browsers might let you break the standards on this one, but Chrome and IE8 (in standards mode) certainly don't.)

Fortunately you don't need this ID, you can traverse the DOM...

Just a couple of notes regarding the code you have posted... Some of the statements inside the loop do not need to be inside the loop, for instance, you already seem to know the lengthoflist but the first thing you do in the loop is to find the list in the DOM (presumably you found the list in the beginning in order to get lengthoflist?). Array indices start at 0, so you should initialise k=0, not k=1. And consequently the last item in the list is at index lengthoflist-1. getElementsByTagName() returns a NodeList, so you need to get the first element from this list (ie. item(0)) in order to getElementsByTagName() of this element (not of the NodeList).

eg.
var myb = mya.getElementsByTagName("div")[0];

This joins all the cell data together and spits it out at the end...

var cellData = ''; 
var listItems = document.getElementById('tester').getElementsByTagName('li'); 
for (var k = 0; k < listItems.length; k++) { 
  cellData += listItems[k].getElementsByTagName('td')[1].innerHTML; 
} 
document.write(cellData);

[Piggo]

Thanks for this. I'd forgotten about unique IDs, thanks for the reminder, I've corrected all of that now.