Finding nth-child of siblings via jQuery

Question

Let's say I have two tables that look like this:

TH   TH   TH   TH  
TD   TD   TD   TD  
TD   TD   TD   TD  

and

TH   TH   TH   TH  
TH   TD   TD   TD  
TH   TD   TD   TD  

I'd like to select the 3rd column in each.

At first I was using nth-child as such:

$('table tr td:nth-child(3)')

But that's not going to work, as 3rd TD is in a different column in each table.

What I need in pseudo code is 'get the 3rd TD or TH in each row'.

I assume I need to use $.siblings but not entirely sure.

Answer 1

You need to write $('table tr *:nth-child(3)')

The :nth-child selector selects elements that are the n^th child of their parent, regardless of how many siblings are matched by the selector.

You're (incorrectly) describing the :eq selector.

Answer 2

This works for me:

$('table tr :nth-child(3)').css('background-color', 'red');

It sets the background color of the 3rd column to 'red' (works for both tables).

Note that there is a space between tr and :nth-child(3), and no td in front of :nth-child(3).

You can check out this site for sample code and experiment with it.