How to Convert List element to an array in JQuery

In this article I have described how to Convert List element to an array with the help of JQuery Selector.
  • 3976

Convert <li> element to an array

  • If we want to convert the <li> elements to an arrray, then it we can use JQuery.
  • In this context we will use toArray() to count the elements in JQuery Selector.

Syntax

<script type="text/javascript">

    $(document).ready(function () {

        $("button").click(function () {

            x = $("li").toArray()

            for (i = 0; i < x.length; i++) {

                alert(x[i].innerHTML);

            }

        });

    });

</script>

Lets take an example

<!DOCTYPE html>

<html>

<head>

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

<script type="text/javascript">

    $(document).ready(function () {

        $("button").click(function () {

            alert($("li").size());

        });

    });

</script>

</head>

<body>

<button>Count The Number Of Student</button>

<ol>

<li>Aman</li>

<li>Nitin</li>

<li>Prabhakar</li>

<li>Styaprakash</li>

<li>Vipin</li>

<li>Shubham</li>

<li>Arun</li>

</ol>

</body>

</html>

 

Above program convert all above <li> elements to an array.

 

OUTPUT

 

JQ ARRAY.gif

 

we can fetch them from an array. when we click on button it will fetch records one by one like.

 

JQ arr2.gif

You may also want to read these related articles Click here

Ask Your Question 

Got a programming related question? You may want to post your question here

Programming Answers here

© 2020 DotNetHeaven. All rights reserved.