pimvdb
pimvdb

Reputation: 154818

nth-child and descendant selector not selecting all expected elements

My DOM is as follows: http://jsfiddle.net/pimvdb/AHJXk/1/.

<table>
    <tr>
        <td>
            <input type="text"><input type="text">
        </td>
        <td>
            <input type="text"><input type="text">
        </td>
    </tr>
    <tr>
        <td>
            <input type="text"><input type="text">
        </td>
        <td>
            <input type="text"><input type="text">
        </td>
    </tr>
</table>

I'm trying to select all inputs in the second td of each tr, i.e. four in total. I thought the following selector would work:

$('table tr td:nth-child(2) input')

But it only returns the first input of each second td (two in total). Why is that? If I do:

$('table tr td:nth-child(1) input')

then I do indeed get all inputs of each first td (four in total).

So why is :nth-child(2) not returning all inputs but only the first one of each matched td?

Upvotes: 1

Views: 1228

Answers (1)

Naftali
Naftali

Reputation: 146302

This will get you all four of them:

$('input','table tr td:nth-child(2)')

Fiddle: http://jsfiddle.net/AHJXk/3/

Upvotes: 1

Related Questions