"List Element Counts"
Bootstrap 4.1.1 Snippet by RizwanAkram

Post to Facebook Tweet this

<link href="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/js/bootstrap.min.js"></script> <script src="//cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> <!------ Include the above in your HEAD tag ----------> <!DOCTYPE html> <html> <head> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> <script> $(document).ready(function(){ $('#count').click(function(){ $("span").html("Count is = " + $("ul li").length); }); }); </script> </head> <style> ul li{ background-color:#4585F3; margin:10px; padding:10px; list-style-type:none; width:200px; } p{ margin-left:50px; font-weight:bold; } </style> <body> <h1>Jquery length Property Example</h1> <ul> <li>One</li> <li>Two</li> <li>Three</li> <li>Four</li> </ul> <p><input type="button" id="count" value="Click Here !!!"> <span></span></p> </body> </html>

Related: See More

Datepicker
bootstrap 4 multiple carousel (3 Element by row)
Video list thumbnails
Accordion Multi Level List Group Menu

Questions / Comments: