CODEWITHSUNDEEP
jqueryhtml-table
Ryan
Ryan

Reputation: 1791

How to select all the first <td> of <tr>?

Here's a part of the table,

<tbody id="list_tbody">
   <tr class="infoRow">
      <td></td>
      <td></td>
      <td></td>
   </tr>
   <tr class="infoRow">
      <td></td>
      <td></td>
      <td></td>
   </tr>
   <tr class="infoRow">
      <td></td>
      <td></td>
      <td></td>
   </tr>
</tbody>

the tag continues... and this is my jQuery code:

$("tr.infoRow td:eq(0)").css("border-left", "1px solid #d0d0d0");

How to select all the first <td> that is inside all the <tr>? On my current code, it only selects the first <td> of the first <tr>. Please correct my jQuery code.

Upvotes: 1

Views: 538

Answers (4)

Clueless
Clueless

Reputation: 4042

$("tr.infoRow td:first-child").css("border-left", "1px solid #d0d0d0");

Upvotes: 6

Mrchief
Mrchief

Reputation: 76268

You can use nth-child selector too:

$("tr.infoRow td:nth-child(1)").css("border-left", "1px solid #d0d0d0");

Upvotes: 2

Jose Adrian
Jose Adrian

Reputation: 1247

alert($('table tr td:nth-child(n)').size()). It should show you '3'.

I think you need to change 'n' for 0 or 1. I don't remember. Check jQuery docs for nth-chi

Upvotes: 1

ShankarSangoli
ShankarSangoli

Reputation: 69915

Try this

$("tr.infoRow td::nth-child(1)").css("border-left", "1px solid #d0d0d0");

Note: nth-child is 1 indexed so you can pass some other number if you want to select any other column.

Upvotes: 3

Related Questions