Polopollo
Polopollo

Reputation: 377

Child selector and ID

I just don't really understand why an ID is not a valid parent: http://api.jquery.com/child-selector/

Valid:

$("#listequestions tr").click(function() {
  $(this).addClass("success");
});

Not valid:

$("#listequestions > tr").click(function() {
  $(this).addClass("success");
});

Can somebody help me to understand why?

Thank you.

Upvotes: 1

Views: 102

Answers (5)

Denys Séguret
Denys Séguret

Reputation: 382150

A tbody is automatically inserted in a table if there is none.

That's why the only possible way to match "#listequestions > tr" would be to give the id to a thead, a tfoot or a tbody.

That's one of the perils of the child selector.

Let's suppose you have the following HTML :

<table id=listequestions>
    <tr><td>some text</td></tr>
</table>​

Then the tr would be matched by those two queries :

  • $('#listequestions > tbody > tr')
  • $('#listequestions tr')

Upvotes: 9

Sushanth --
Sushanth --

Reputation: 55750

$("#listequestions  tr")

Will try to match all the children which are tr

$("#listequestions > tr")

Will match only the immediate children..

So if tr is not the immediate child then the second will not work..

As dystroy pointed out

Upvotes: 1

Sridhar Narasimhan
Sridhar Narasimhan

Reputation: 2653

Here you are selecting the direct child inside the element with id listequestions

$("#listequestions > tr").click(function() {
  $(this).addClass("success");
});

and here you are selecting all elements inside element with id listequestions which includes sub childs.

$("#listequestions tr").click(function() {
  $(this).addClass("success");
});

Thanks

Upvotes: 1

tgormtx
tgormtx

Reputation: 322

$("#listequestions").find("tr").click(function() {
      $(this).addClass("success");
});

Upvotes: 0

hall.stephenk
hall.stephenk

Reputation: 1165

Would this work instead?

$("#listequestions").children("tr").click(function() {
      $(this).addClass("success");
    });

Upvotes: 0

Related Questions