Skip to content
Related Articles

Related Articles

Improve Article

How to count every element including head body in the document in jQuery ?

  • Last Updated : 09 Sep, 2021
Geek Week

In this article, we will count every element (including head, body, etc) in the document using jQuery. To count all HTML elements, we use length property. The length property is used to count number of the elements of the jQuery object. 

Syntax:

$(selector).length

where selector is the object whose length is to be calculated.

Example:

HTML




<!DOCTYPE html>
<html lang="en">
 
<head>
   
    <!-- Import jQuery cdn library -->
    <script src=
    </script>
 
    <script>
        $(document).ready(function () {
            $("button").click(function () {
                var count = $(".GFG").find("*").length;
                $("p").after("<h3>Totoal Div Elements: "
                    + count);
            });
        });
    </script>
</head>
 
<body style="text-align: center;">
    <h1 style="color: green;">
        GeeksforGeeks
    </h1>
 
    <h3>
        How to count all elements
        within a div using jQuery?
    </h3>
   
    <div class="GFG">
         
     
<p>
        GeeksforGeeks computer
        science portal
    </p>
 
 
        <input type="text">
    </div><br>
   
    <button>Click Here!</button>
</body>
 
</html>

Output:



Before Click Button:

After Click Button: 

Attention reader! Don’t stop learning now. Get hold of all the important HTML concepts with the Web Design for Beginners | HTML  course.




My Personal Notes arrow_drop_up
Recommended Articles
Page :