CODEWITHSUNDEEP
javascriptjquery
Istiaque Ahmed
Istiaque Ahmed

Reputation: 6488

Explanation of two arguments for jQuery .each() method

In the following jQuery, the .each() method takes two arguments: 'ul li a' and menu. What do these two arguments mean?

var menu = $('.menu');
$('ul li a', menu).each(function() {
    $(this).append('<span />');
});

HTML:

<div class="menu">
    <ul>
        <li><a href="#">Edit Profile</a></li>
        <li><a href="#">Account Settings</a></li>
        <li><a href="#">Appear Offline</a></li>
        <li><a href="#">Logout</a></li>
    </ul>
</div>

Upvotes: 5

Views: 475

Answers (2)

AmGates
AmGates

Reputation: 2123

Hello Brother Assalamu Alaikkum,
The explanation is as follows,
The first parameter is 'ul li a' It means that it searches for the anchor tag within the list item tag which in turn present inside the unordered list tag. This first argument is the sub context.

The second parameter menu which is the main context. That is jquery searches for the elements with the class name as "menu".

Finally jquery searches the sub context within the main context. So the jquery searches for the main context "menu" first and then it searches the sub context within the main context. The keyword "each" denotes all the sub elements to be searched within the main element.

hope this helps you.

Upvotes: 1

Adam Rackis
Adam Rackis

Reputation: 83366

The second parameter to the jQuery function is the context. This tells jQuery to only search for elements that are in that context

So for your example:

$('ul li a', menu).each(function() {
    $(this).append('<span />');
});

This will only search for anchors within li's within a ul, that are also located inside of menu.

This can be a very useful optimization since it can significantly cut down the amount of space jQuery has to search.

EDIT

To possibly make this a bit clearer (as jfriend00 points out), your particular example, $('ul li a', menu), is equivalent to $('.menu ul li a')

The context parameter is explained here in the docs

Upvotes: 7

Related Questions