CODEWITHSUNDEEP
jquery
bobby
bobby

Reputation: 13

jQuery: How to get the first “td” in all rows

I have a table, and I want get the first “td” in all rows.

My jquery here:

$("table.SimpleTable tr td:first-child").css('background-color','red');

and my HTML here:

<table class='SimpleTable' border="1" ID="Table1">
        <tr>
            <td>Left</td>
            <td>Right</td>
        </tr>
        <tr>
            <td>Left</td>
            <td>Right</td>
        </tr>
        <tr>
            <td>Left</td>
            <td>Right</td>
        </tr>
        <tr>
            <td>Left</td>
            <td>
                <table border="1" ID="Table2">
                    <tr>
                        <td>AAA</td>
                        <td>AAA</td>
                        <td>AAA</td>
                    </tr>
                </table>
            </td>
        </tr>
        <tr>
            <td>Left</td>
            <td>
                <table border="1" ID="Table3">
                    <tr>
                        <td>BBB</td>
                        <td>BBB</td>
                        <td>BBB</td>
                    </tr>
                </table>
            </td>
        </tr>
    </table>

The problem here it get the first "td" in the nested table of the second "td".

Please help me!

Upvotes: 1

Views: 2224

Answers (3)

nikc.org
nikc.org

Reputation: 16993

Normal CSS selectors will work, you were almost spot on. First td in a nested table would be 

$('table table tr td:first-child');

To limit the selection only to the second table would be:

$('table table tr td:first-child').filter(':nth(1)');

Live example at jsfiddle

Upvotes: 0

Sarfraz
Sarfraz

Reputation: 382879

You need to select immediate/direct children, try this:

$("table.SimpleTable > tr td:first-child").css('background-color','red');

The > allows you to target only the immediate elements

Upvotes: 0

Anurag
Anurag

Reputation: 141909

try:

$("table.SimpleTable > tbody > tr > td:first-child").css(..);

> only searches in children instead of all descendants. we need tbody as browsers insert that into the table.

example here.

Upvotes: 1

Related Questions