How to loop through array with jQuery.each()?

January 5, 2021 admin

In this tutorial, we are going to see how to loop through array with jQuery.each()? The JQuery.each() or $.each() method can be used to iterate transparently over any collection, whether it is an object or an array. Since the $.each() function gets and internally uses the “length” property of the passed array or object. So if you have a property called “length” – eg. {en: ‘english’, length: 7} – the function may not work correctly.

How to loop through array with jQuery.each()?

<!DOCTYPE html>
<html>
<head>
<title>Loop through array with jQuery.each()</title>
<script src="https://code.jquery.com/jquery-1.12.4.min.js"></script>
<script type="text/javascript">
    $(document).ready(function(){
        var colors = ["Blue", "Red", "Orange", "Green", "Blue"];
        $.each(colors, function(index, value){
            $("#colors").append(index + ": " + value + '<br>');
        });
    });
</script>  
</head> 
<body>
    <div id="colors"></div>
</body>
</html>

Output:

0: Blue
1: Red
2: Orange
3: Green
4: Blue

How to loop through array with jQuery.each()?

You May Also Like

How to disable href link in jQuery

How to count words using JQuery

How to remove a tag without deleting its content with jQuery

Leave a Reply Cancel reply