Iterate over div's tables and their elements?

If I have a div res which contains N table elements with Y div's with id eye-d inside of them..

How开发者_开发知识库 would I iterate over these for each table getting the eye-d.innerHTML's?

NOTE: eye-d is unique. There is many tables in the 1 eye-d.

Example of eye-d

<div id=​"eye-d">​
  <table border=​"0" cellpadding=​"2" cellspacing=​"1" class=​"list">​
    <tbody>​
      <tr class=​"table_text">​…​</tr>​
        <tr>​
         <td class=​"odd">​…​</td>​
         <td class=​"odd">​ABC</td>​
         <td class=​"odd">​N/A​</td>​
        </tr>​
    </tbody>​
  </table>​
</div>

As requested.. rephrased...

I have 1 div with an id eye-d then I have many tables... each of these tables have many div's with class odd. I want the .innerHTML's of the odd's for each table inside eye-d.

Your id's are not unique.

You cannot have more than one <div> with an id of "eye-d".

Id's have to be unique whilst the name property does not have to be unique. You may want to use classes instead.

<div class="eye-d"> ... </div>

[[Edit]]

The selector for those div's is as simple as $("#eye-d table .odd") (uses jQuery )

If you must use raw JS then you can :

var div = document.getElementById("eye-d");
var tables = [];
recurse(res.childNodes, function(el) {
    if (el.nodeName.toLowerCase() === "table") {
        tables.push(el);
    }
});
// array of innerHTML of odd divs.
var oddDivs = [];
for (var i = 0, ii = tables.length; i < ii; i++) {
    recurse(tables[i].childNodes, function(el) {
        if (el.className.indexOf("odd") > 0) {
            oddDivs.push(el.innerHTML);
        }
    });
}

function recurse(nodeList, do) {
    for (var i = 0, ii = nodeList.length; i < ii; i++) {
        do(nodeList[i]);
        if (nodeList[i].childNodes.length > 0) {
            recurse(nodeList[i].childNodes, do);
        }
    }
}

Recurse recursively walks the node tree to and calls do for every element if finds. You can then search for whatever you want.

If there are Y divs and by eye-d you mean eye- followed by a *d*igit/number, then it's as easy as while (Y--) document.getElementById('eye-'+Y).innerHTML=...

As I understand it, you have:
1. A div with an ID of eye-d.
2. There are several tables inside of this div.
3. You want to get each table and view its innerHTML.

var allTables = document.getElementById('eye-d').getElementsByTagName('table');  
for(i in allTables){ alert(allTables[i].innerHTML); }