Introduction:

In this article we will learn what is .each() method in jQuery or how to use .each() method in jQuery with example.

Description:

jQuery’s .each()  function is used to loop through a collection (object type or array type). Array-like objects with a length property are iterated by their index position and value. Other objects are iterated on their key-value properties. The "JQuery .each()" function however works differently from the $(selector).each() function that works on the DOM target element using the selector. But both iterate over a jQuery object.

Example

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>Jquery Tutorials</title>
    <script src="Scripts/jquery-1.8.2.min.js"></script>
    <script>
        $(document).ready(function () {
            $(document).ready(function () {
                var obj = {
                  Name: "Aditya",Language: "Jquery", Webiste: "SQL Tutorials Point"
                };
                // each loop overe object
                $.each(obj, function (key, value) {
                    console.log(key + ": " + value);
                });
 
                //each loop over element
                $("li").each(function () {
                    console.log($(this).text())
                });
            });
        });
    </script>
 
</head>
<body>    
    <ul>
        <li>Coffee</li>
        <li>Milk</li>
        <li>Soda</li>
        <li>Neem</li>
    </ul>
</body>
</html>
 

Above code snippet will iterate through every li of the page and object both output show in console window like as below:

How to iterate through each selected element of the page in jQuery


0 comments


Leave a comment

Make sure you enter the (*) required information where indicated. HTML code is not allowed.

you may also like