How to check if element is empty using jQuery?
You can use jQuery is() and :empty Selector together to check whether elements is empty or not before performing some action on that element.
if ($('#idDiv').is(':empty')){
//do something
}
<Div id="idDiv">This Div is not empty</div>

This Div is not empty
<html>
<head>
<title>jQuery isEmpty example</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
$("#bt1").click(function(){
if ($('#idDiv').is(':empty')){
alert("is empty");
}else{
alert("not empty");
}
});
$("#bt2").click(function(){
if ($('.classDiv').is(':empty')){
alert("is empty");
}else{
alert("not empty");
}
});
});
</script>
</head>
<body>
<Div id="idDiv">This Div is not empty</div>
<button id="bt1">Not Empty</button>
<Div class="classDiv"></div>
<button id="bt2">Empty Div</button>
</body>
</html>
jQuery is() method
jQuery is() method checks if one of the selected elements matches the selectorElement. This method traverses along the DOM elements to find a match, which satisfies the passed parameter. It will return true if there is a match otherwise returns false .:empty Selector
The :empty selector matches every element that has no children. Children can be either element nodes or text (including whitespace). White space and line breaks are the main issues with using :empty selector . In CSS the :empty pseudo class behaves the same way. So, alternatively you can use the following method to check whether elements is empty or not.
if ($someElement.children().length == 0){
doSomeAction();
}
If by empty , you mean with no HTML content and no white space either. If there's a chance that there will be white space, then you can use $.trim() and html() to check whether elements is empty or not.
if($.trim($("selector").html())==''){
doSomeAction();
}
JavaScript
Using plain JavaScript , you can use the following code to check whether elements is empty or not.
var isEmpty = document.getElementById('cartContent').innerHTML === "";
Related Topics
- jQuery Interview Questions (Part-2)
- jQuery Interview Questions (Part-3)
- Is jQuery a programming language?
- Why do we need to go for JQuery?
- How to check jQuery version?
- How to multiple version of jQuery?
- What is jQuery CDN?
- Advantages of minified version of JQuery
- How do I check if the DOM is ready?
- How to Use the jQuery load() Method
- Difference between document.ready() and body onload()?
- Is jQuery is a replacement of JavaScript?
- JQuery or JavaScript which is quicker in execution?
- What is the use of param() method?
- How to work with jQuery parent(), children() and siblings()?
- Difference between parent() and parents() in jQuery?
- What does jQuery data() function do?
- How do you check if an element exists or not in jQuery?
- How to run an event handler only once in jQuery?
- How to disable/enable an element with jQuery
- Hide and show image on button click using jQuery
- Difference Between Prop and Attr in jQuery
- How do I check if an element is hidden in jQuery?
- What happen if you return false from a jQuery event handler?
- What is each() function in jQuery? How do you use it?
- Which one is more efficient, document.getElementbyId( "myId") or $("#myId)?
- What is the difference between $.map and $.grep in jQuery
- What is the use of serialize method in jQuery
- What is the use of clone method in jQuery?
- What is event.PreventDefault in jQuery?
- Difference between event.PreventDefault and event.stopPropagation?
- What are deferred and promise object in jQuery?
- What are source maps in jQuery?
- What does the jQuery migrate function do?
- Differences Between jQuery .bind() and .live()?
- How can you delay document.ready until a variable is set?
- How to disable cut,copy and paste in TextBox using jQuery?
- How to prevent Right Click option using jquery?
- How does the jQuery pushStack function work?
- Why use jQuery filter() Methods?
- Difference between find() and closest() in jquery?
- How To Use Ajax In Jquery?
- How to multiple AJAX requests be run simultaneously in jQuery?
- Can we call C# code behind using jQuery?
- How to include jQuery in ASP.Net project?
- Need to add jQuery file in both Master and Content page?
- Uncaught TypeError: $(…).modal is not a function jquery
- How to check whether a checkbox is checked in jQuery?
- Uncaught ReferenceError: $ is not defined
- How to Convert JSON Date to JavaScript/jQuery date