---
title: "How to use the hasClass() in JQ? also expain the toggleClasss() in JQuery."  
description: "How to use the hasClass() in JQ? also expain the toggleClasss() in JQuery."  
author: "Ethan Karla"  
published: 2021-07-28  
canonical: https://answers.mindstick.com/qa/93816/how-to-use-the-hasclass-in-jq-also-expain-the-toggleclasss-in-jquery  
category: "web application"  
tags: ["web development", "web application development"]  
reading_time: 2 minutes  

---

# How to use the hasClass() in JQ? also expain the toggleClasss() in JQuery.

what are the [role](https://yourviews.mindstick.com/view/85446/national-doctor-s-day-recognizing-the-indispensable-role-of-doctors-in-one-s-life) of addClass() in JQ? how to [add](https://yourviews.mindstick.com/story/4883/5-signs-you-need-to-add-more-protein-to-your-diet) [css](https://www.mindstick.com/forum/514/background-gradient-ie7-css-problem) [property using the addClass](https://answers.mindstick.com/qa/93815/what-are-the-role-of-addclass-in-jq-how-to-add-css-property-using-the-addclass)().

## Answers

### Answer by Ravi Vishwakarma

The **hashClass()** method in Jquery checks whether the given class name is existing or not, if it is yes, then this function returns true, if it is not, it returns false. To make the website more responsive.

> Syntax:\
> $(selector).hasClass(classname)

jQuery's **toggleClass()** method is used to add or remove one or more classes from selected elements. This toggleClass() automatically adds and removes classes. If the class is added then it is given class remove, If the class removed then it is given add number.

> Syntax:\
> $(selector).toggleClass(classname)\
> $(selector).toggleClass(classname,function(index,currentclass),switch)

```
<!DOCTYPE html>
<html>
<head>
<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js'></script>
<script>
    $(document).ready(function () {
        $('button').click(function () {
            alert('hasClass : '+ $('div').hasClass('panel'));
            $('div').toggleClass('panel');
            alert('hasClass : ' + $('div').hasClass('panel'));
        });
    });
</script>
<style>
    body {
    margin:10px;
    }
    .panel {
        box-sizing:border-box;
        padding:10px;
        background-color:red;
        color:white;
        font-size:45px;
        width:100%;
        height:auto;
        text-align:center;
    }
</style>
</head>
<body>
 <div >
     <h1>This is div by toggle effected </h1>
 </div><br />
<button>Click here </button>
</body>
</html>
```

![How to use the hasClass() in JQ? also expain the toggleClasss() in JQuery.](https://answers.mindstick.com/questionanswer/eb8895c7-f538-4232-9c90-d9de3ff0e804/images/50948dc9-c364-4388-a0ff-9aeab2388480.png)\


---

Original Source: https://answers.mindstick.com/qa/93816/how-to-use-the-hasclass-in-jq-also-expain-the-toggleclasss-in-jquery

Copyright © MindStick Software Pvt. Ltd. This Markdown version is provided for developers, AI systems, and offline reading.
