What is the use of .each() function in jQuery ? Last Updated : 01 Jul, 2021 Comments Improve Suggest changes Like Article Like Report The each() function in jQuery iterate through both objects and arrays. Arrays that have length property are traversed from the index 0 to length-1 and whereas arrays like objects are traversed via their properties names. Syntax: $.each('array or object', function(index, value){ // Your code }) In this .each() function, an array or an object is given as the first argument and a callback function. This callback function optionally takes two parameters that are index and value. Therefore, we have to pass a callback function to each() method. Example 1: HTML <!DOCTYPE html> <html lang="en"> <head> <!-- using jquery library --> <script src= "https://code.jquery.com/jquery-git.js"> </script> </head> <body> <script> let arr = [10, 20, 30, 40, 50]; $.each(arr, function (index, value) { document.write(index + ": " + value + "<br>"); }); </script> </body> </html> Â Output: $(selector).each(): We can also break the loop early by returning false from the callback function. It is the same as above each() function, but it iterates over the DOM elements of the JQuery object and can execute a function for every element. Syntax: $('selector').each(function(index, value){ // Your code }) It only accepts a callback function that executes for each selected element. Example: HTML <!DOCTYPE html> <html lang="en"> <head> <!-- using jquery library --> <script src= "https://code.jquery.com/jquery-git.js"> </script> </head> <body> <p>para-1</p> <p>para-2</p> <p>para-3</p> <p>para-4</p> <p>para-5</p> <script> $("p").each(function (index) { console.log(index + ": " + $(this).text()); }); </script> </body> </html> Output: Comment More infoAdvertise with us Next Article What is the use of .each() function in jQuery ? H hritikrommie Follow Improve Article Tags : Web Technologies JQuery jQuery-Methods jQuery-Questions Similar Reads What is the use of ready() function in jQuery ? In this article, we will see how to use ready() function provided by the jQuery library. The ready() function is used to execute some javascript code only when the HTML DOM is fully loaded. We should not manipulate the DOM until it is fully loaded. ready() method comes very handy to detect when the 1 min read What is the use of html() method in jQuery ? The html() method in jQuery is used to get the contents of the first element in the set of matched elements or is used to set the HTML contents of every matched element. It returns the content of the first matched element. This function does not accept any arguments. Syntax: $(selector).html();Appro 4 min read What is the use of delegate() method in jQuery ? jQuery is an open-source JavaScript library that simplifies the interactions between an HTML/CSS document, or more precisely the Document Object Model (DOM), and JavaScript. Elaborating the terms, simplifies HTML document traversing and manipulation, browser event handling, DOM animations, Ajax inte 2 min read What is the use of append() method in JQuery ? In this article, we are going to see how to use the append() method in jQuery. The append() method is used to insert new content inside an existing element. There are some other methods also that provide to insert new content inside an existing element and these are - prepend(), html(), text(), befo 2 min read What is the use of css() method in jQuery ? In this article, we will see how to use css() method to set the styles on elements dynamically using jQuery. The css() method is used to change the style property of the selected element. basically, The CSS() method is used to get the value of a certain CSS property that has been applied to a specif 2 min read Like