Aspdotnet-Suresh

aspdotnet-suresh offers C#.net articles and tutorials,csharp dot net,asp.net articles and tutorials,VB.NET Articles,Gridview articles,code examples of asp.net 2.0 /3.5,AJAX,SQL Server Articles,examples of .net technologies

jQuery Check if Div Element has Class or Not Example

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.


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


<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>jQuery Check If Div Element has Particular Class or Not</title>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.10.2.js"></script>
<script type="text/javascript">
$(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>
<style type="text/css">
.purplcls {
background:purple;
color:White;
}
.blucls {
background: blue;
}
</style>
</head>
<body>
<form id="form1">
<div id="divdetails" style=" cursor:pointer; width:20%; height:50px; text-align:center; font-weight:bold">
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


If you enjoyed this post, please support the blog below. It's FREE!

Get the latest Asp.net, C#.net, VB.NET, jQuery, Plugins & Code Snippets for FREE by subscribing to our Facebook, Twitter, RSS feed, or by email.

subscribe by rss Subscribe by RSS subscribe by email Subscribe by Email

0 comments :

Give your Valuable Comments

Other Related Posts

© 2015 Aspdotnet-Suresh.com. All Rights Reserved.
The content is copyrighted to Suresh Dasari and may not be reproduced on other websites without permission from the owner.