|
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
|