jquery remove class – How to use removeClass() method in jQuery?

jquery remove class. The removeClass() method is used to remove or delete one, multiple, or all the class names from the class attributes of the matched elements.

jquery remove class

you can remove the classes from the elements using the jQuery removeClass() method. The removeClass( class ) method removes all or the specified class(es) from the set of matched elements.

jQuery – removeClass( class ) Method

index.html

<html>
   <head>
      <title>The Selecter Example - www.pakainfo.com</title>
      <script type = "text/javascript" 
         src = "https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js">
      </script>
   
      <script type = "text/javascript" language = "javascript">
         $(document).ready(function() {
            $("p#dev1").removeClass("red");
         });
      </script>
		
      <style>
         .red { color:red; }
         .green { color:green; }
      </style>
   </head>
	
   <body>
      <p class = "red" id = "dev1">Most IMP Website Www.paakinfo.com.</p>
      <p class = "green" id = "pid2">Second website www.infinityknow.com.</p>
   </body>
</html>

jQuery addClass() Method

index.html

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>jQuery addClass() Demo</title>
<style>
    .page-header{
        color: red;
        text-transform: uppercase;
    }
    .highlight{
        background: yellow;
    }        
</style>
<script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
<script>
$(document).ready(function(){
    $("button").click(function(){
        $("h3").addClass("page-header");
        $("p.hint").addClass("highlight");
    });
});
</script>
</head>
<body>
    <h3>Download Source Code</h3>
    <p>The removeClass() method removes one or more class names from the selected elements....</p>
    <p class="hint"><strong>Tip:</strong>  How jQuery removeClass() Works .</p>
    <button type="button">Add Class</button>
</body>
</html>

Free Live Chat for Any Issue

jQuery removeClass() Method

index.html

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>jQuery removeClass() Demo - www.pakainfo.com</title>
<style>
    .page-header{
        color: red;
        text-transform: uppercase;
    }
    .highlight{
        background: yellow;
    }        
</style>
<script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
<script>
$(document).ready(function(){
    $("button").click(function(){
        $("h3").removeClass("page-header");
        $("p").removeClass("hint highlight");
    });
});
</script>
</head>
<body>
    <h3 class="page-header">Welcome Pakainfo</h3>
    <p>NEW Welcome Line for WWW.pakainfo.com Hello...</p>
    <p class="hint highlight"><strong>Tip:</strong> Free Download Welcome pakainfo.com.</p>
    <button type="button">Remove Class</button>
</body>
</html>

jQuery remove class from all elements

I hope you get an idea about jquery remove class.
I would like to have feedback on my infinityknow.com blog.
Your valuable feedback, question, or comments about this article are always welcome.
If you enjoyed and liked this post, donโ€™t forget to share.

Rate this post

Also Read This ๐Ÿ‘‰   PHP Laravel 5.7 Image Upload with Validation Tutorial Example