I have a table and I was able to select the first cell of each row successfully, but I can not use the same code to select the second cell of each row. Please help me select and change the CSS of the second cell of each row. The reason that I don't use normal CSS is because these are future cells of a table.

$("#part_rows tr td:first-child").css("width","150px");

The above one works fine, but the following does not work.

$("#part_rows tr td:second-child").css("width","150px");

I have a table and I was able to select the first cell of each row successfully, but I can not use the same code to select the second cell of each row. Please help me select and change the CSS of the second cell of each row. The reason that I don't use normal CSS is because these are future cells of a table.

$("#part_rows tr td:first-child").css("width","150px");

The above one works fine, but the following does not work.

$("#part_rows tr td:second-child").css("width","150px");

• javascript
• jquery
• css

• 1 $("#part_rows tr:nth-child(2)")?? – Derek 朕會功夫 Commented Jan 20, 2013 at 3:35
• 3 0% accpet rate is not being very respectful of munity that helps you when you've asked 11 questions already – charlietfl Commented Jan 20, 2013 at 3:35

3 Answers 3

Use the nth-child selector:

$("#part_rows tr td:nth-child(2)").css("width","150px");

If you plan to use jQuery, an hour spent browsing through the entire list of jQuery methods and selectors will save you a lot of time down the track...

"the reason that I dont use normal css because these are future cells of a table."

Did you try with "normal" CSS? I think you'll find that it works on elements that are added dynamically.

you are looking for the :nth-child selector

$("#part_rows tr").find('td:eq(1)')

In jQuery bining .find() - you can use 2 nice guys that do the job pretty well. You can take a look:

http://api.jquery./find/
http://api.jquery./eq/
http://api.jquery./eq-selector/