jQuery Check if Div Element has Class or Not Example

By: Suresh Dasari Jul 19, 2016

Introduction:

Here I will explain how to use jQuery to check if div has particular class or not with example or jQuery check if element has particular class or not example or jQuery check if div contains particular class name or jQuery check if element has class attribute or not with example. By using hasClass() method in jQuery we can check if div element has particular or not easily.

Description:

In previous articles I explained jQuery scroll to particular div position when click on link, jQuery add or remove css class to div element example, jquery custom styles for radio button / checkbox / dropdownlist / textbox example, jQuery change textbox background color on focus / blur example, jQuery draggable and resizable div with example, jQuery add fadein effect to page example and many articles relating to css, AngularJS, jQuery, JavaScript and asp.net. Now I will explain how to use jQuery to check if div element has class or not with example.

To check if element has particular class or not in jQuery we need to write the code like as shown below

if($(this).hasClass("purplcls"))

$(this).removeClass("purplcls");

else

$(this).addClass("purplcls");

If you want complete example to check if div has particular class or not we need to write the code like as shown below

<head>

<title>jQuery Check If Div Element has Particular Class or Not</title>

$(function(){

$('#divdetails').addClass("purplcls");

$('#divdetails').click(function () {

if($(this).hasClass("purplcls")){

$(this).removeClass("purplcls");

$(this).addClass("blucls");

}

else{

$(this).removeClass("blucls");

$(this).addClass("purplcls");

}

})

</script>

.purplcls {

background:purple;

color:White;

}

.blucls {

background: blue;

}

</style>

</head>

<body>

Sample Div

</div>

</form>

</body>

</html>

Live Demo

To check live demo click on below purple color div here we will check if div has purple color class or not in case if it there we will change to blue color class otherwise purple color class using jQuery.

Sample Div