Is there a way to combine $(this) with :nth-child?

Todd Vance picture Todd Vance · May 12, 2011 · Viewed 30.4k times · Source

I'm in the middle of an .each iteration and wanted to call out the 2nd or 3rd child for the each..but cant make it work.

alert($(this + ' :nth-child(2)').attr('id'));

My only option that I can think of is something terrible goofy like this:

 $(this).children(':first').next().attr('id', 'ddParam' + newCount);
 $(this).children(':first').next().next().attr('id', 'txt' + newCount);
 $(this).children(':first').next().next().next().attr('id'...

Answer

kapa picture kapa · May 12, 2011

What you need is context. With context, the selector will only look for elements that are the children of the context (in this case this).

$(':nth-child(2)', this).attr('id');

jsFiddle Demo

This is basically the same as:

$(this).find(':nth-child(2)').attr('id');

If you only need the direct children, not every descendant, you should use .children():

$(this).children(':nth-child(2)').attr('id');