Question

If I have:

<div id='parent'> 
  <table> 
        <tr> 
            <td> 
                <div id='child1'></div> 
            </td> 
        </tr> 
        <tr> 
             <td> 
                <div id='child2'></div> 
             </td> 
        </tr> 
    </table>
 </div> 

I tried: $(‘#parent> table > tr:eq(1) > div’);

I would like to select a certain child div at its index. For example, I would like to select the second child div child2. A trivial solution is:

var div2 = $('#child2');

But I would rather like to do so with the parent div:

var div2 = $('#parent div')...get(1); // 1 is the index.

Would this be possible?

Answer 1

You can do it using the :eq() selector like this:

$("#parent > div:eq(1)")

Or if it’s dynamic and you need to pass it in, use .eq() like this:

$("#parent > div").eq(1)

In both of these we’re using 1 because it’s a 0-based index, so 1 is the 2nd child.