What is the difference between $.each(selector) and $(selector).each()

Solution 1:

Description:

.each is an iterator that is used to iterate over only jQuery objects collection while jQuery.each ($.each) is a general function for iterating over JavaScript objects and arrays.

Examples

1) Using $.each() function

var myArray = [10,20,30];

$.each( myArray, function(index, value) {
   console.log('element at index ' + index + ' is ' + value);
});

//Output
element at index 0 is 10
element at index 1 is 20
element at index 2 is 30

2) Using .each() method

$('#dv').children().each(function(index, element) {
    console.log('element at index ' + index + 'is ' + (this.tagName));
    console.log('current element as dom object:' + element);
    console.log('current element as jQuery object:' + $(this));
});

//Output
element at index 0 is input
element at index 1 is p
element at index 2 is span

Resources

• https://api.jquery.com/jquery.each/
• http://api.jquery.com/each/
• jQuery to loop through elements with the same class

Solution 2:

from http://api.jquery.com/jQuery.each:

The $.each() function is not the same as .each(), which is used to iterate, exclusively, over a jQuery object. The $.each() function can be used to iterate over any collection, whether it is a map (JavaScript object) or an array.

Solution 3:

You want to really use $.each with an array that isn't elements or something. ie:

var x = ["test", "test2"];

You'd use $.each(x... to traverse that instead of x.each :)

.each is for elements only :)