Explanation of two arguments for jQuery .each() method

Question

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>

Answer 1

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

Answer 2

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.