HDTuto.com

JQuery Count Child Elements in Div with Class Example



Hi All,

Today, i will let you know example of jquery number of elements in div. if you want to see example of jquery count child elements in div then you are a right place. In this article, we will implement a jquery count elements with id in div. you can understand a concept of jquery how to count elements in div.

Here you will learn jquery count number of elements in div. i would like to share with you jquery number of elements in div.

Let's see bellow simple example of count child elements in div using jquery. you can also count specific tag in div using jquery. i will give two example that will help you.

Example: Count "p tag" in Div

<!DOCTYPE html>

<html>

<head>

<title>jquery count number of elements in div - itsolutionstuff.com</title>

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>

</head>

<body>

<h1>jquery count number of elements in div - itsolutionstuff.com</h1>

<div id="myDiv">

<h1>Hi</h1>

<p>Hello 1</p>

<p>Hello 2</p>

</div>

<button class="btn1">Click Me!</button>

<script>

$(document).ready(function(){

$('.btn1').click(function(){

var elementCount = $('#myDiv p').length;

alert(elementCount);

});

});

</script>

</body>

</html>

Example: Count all tag in Div

<!DOCTYPE html>

<html>

<head>

<title>jquery count number of elements in div - itsolutionstuff.com</title>

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>

</head>

<body>

<h1>jquery count number of elements in div - itsolutionstuff.com</h1>

<div id="myDiv">

<h1>Hi</h1>

<p>Hello 1</p>

<p>Hello 2</p>

</div>

<button class="btn1">Click Me!</button>

<script>

$(document).ready(function(){

$('.btn1').click(function(){

var elementCount = $('#myDiv *').length;

alert(elementCount);

});

});

</script>

</body>

</html>

I hope it can help you...




April 25, 2020 | Category : JQuery



Blog Search


Copyright © 2020 HDTuto.com. All rights reserved.