jQuery length property

The length property in jQuery is used to count the number of elements in the jQuery object.

The size() function also returns the number of elements in the jQuery object. But it is preferred to use the length property over the size() function because the length property avoids an extra function call, so it is quicker than the size() function. We can use the length property as an alternative of the size() function because the size() function is deprecated in jQuery version 1.8, and it is completely removed in version 3.0.

Syntax

This property returns the length of the specified selector. The selector is the jQuery object whose length is to be calculated.

Example

In this example, there are three paragraph elements. We are using the length property to count the number of paragraph elements.

<!DOCTYPE html>
<html>
<head>
<script src = "https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"> </script>
<script>
$(document).ready(function(){
$("#b1").click(function(){
alert($("p").length);
});
});
</script>
</head>

<body>
<h4> This is an example of using the jQuery length property </h4>
<p> First paragraph </p>
<p> Second paragraph </p>
<p> Third paragraph </p>
<h5> Click the following button to count the number of paragraph elements. </h5>
<button id = "b1"> Click me </button>

</html>

Test it Now

Output

After the execution of the above code, the output will be -