Search code examples
jquerychaining

Chaining confusion

Say I have this HTML:

<div id="div_box">
    <ul>
        <li class="li1"></li>
        <li class="li2"></li>
        <li class="li3"></li>
    </ul>
</div>

And I want to remove the class "li1".

I tried this with jQuery:

$("#div_box").find(".li1").removeClass("li1");

It works, but what I don't understand is why does it work. In chaining, the method only applies to the selector given. But #div_box does not have a class called "li1" so this shouldn't work.

Am I misunderstanding how chaining works? Could someone clarify on why this works?

Solution

  • The .find() method return all the descendants of #div_box which is having the class li1...

    not all jQuery methods return the same set of objects on which it was called upon... mostly the tree traversal methods returns a different set of objects