Home > DeveloperSection > Articles > JQuery each method

JQuery each method

Posted by  Sachindra Singh
on    February-21-2011 22:02 PM

JQuery JQuery 
Ratings:
0 Comment(s)
 2433  View(s)
Rate this:

JQuery each method

The $.each () function can be used to iterate over any element collection. This function runs on the matched element. The each () method specifies a function to run for each matched element. In this example I am using each method to show each city name that defined in <option> element.

Syntax: $(“target”).each ();

Code:

<title>JQuery each method</title>

 

    <script type="text/javascript" src="jquery.min.js">     </script>

 

    <script type="text/javascript">

        $(document).ready(function() //ready function contain all jquery function

        {

            $("button").click(function            {

                $("option").each(function()// each method will retrieve all city name that define in <option> element

 {

                alert($(this).text()); //this line will show city name

                });

            });

 

        });

    </script>

 

</head>

<body>

    <h2>

        JQuery each method</h2>

    <table width="200">

        <tr>

            <td align="center">

                City List

            </td>

        </tr>

        <tr>

            <td>

                <select>

                    <option>Allahabad</option>

                    <option>Varanasi</option>

                    <option>Lucknow</option>

                    <option>Kanpur</option>

                    <option>Fridabad</option>

                    <option>Mumbai</option>

                    <option>Chandigarh</option>

                </select>

            </td>

            <td>

                <button>

                    Total Cities</button>

              

            </td>

        </tr>

    </table>

</body>

When I will click on city button the name of city will popup on window as shown below:

Screenshot

JQuery each method

 
















Recent Activities


Barbara Jones added new Question What is ANR?   3 days ago

Kamlakar Singh added new Blog Convert Text Document to PDF File   17 days ago

Kamlakar Singh added new Article Introduction to Backbone.js   17 days ago

Don't want to miss updates? Please click the below button!