CODEWITHSUNDEEP
jqueryjquery-selectorscss-selectors
Matthew Davis
Matthew Davis

Reputation: 142

Avoid selecting nested td's. How?

I have this code:

$("#widgetstable tr td:nth-child("+column+")").hide();

But it selects any td's that happen to be nested inside the selected td's. (And there are a couple.)

I tried $("#widgetstable > tr > td:nth-child("+column+")").hide(); but it didn't select ANYTHING.

Upvotes: 0

Views: 77

Answers (1)

Jason Sperske
Jason Sperske

Reputation: 30446

A tbody is inserted silently when your browser parses your HTML, and the > selector means the direct child of the parent. For the following HTML this selector would work:

<style>
   td {
     background-color: blue;
   }
</style>
<table id='widgetstable'>
  <tr>
    <td>Me</td>
  </tr>
  <tr>
    <td>
      <table>
        <tr><td>Not Me</td></tr>
      </table>
    </td>
  </tr>
</table>
<script>
  $("#widgetstable > tbody > tr > td").css('background-color', 'red');
</script>

Here is a demo

Upvotes: 4

Related Questions