How to add or remove class using jquery?

How to remove class in jQuery

File name : index.php

<!DOCTYPE html>
<html lang="en">
<head>
<script src="https://code.jquery.com/jquery-1.12.4.min.js"></script>
<meta charset="utf-8">
<title>How to add class in jQuery</title>
<style>
.container {
width: 100%;
border: 4px solid green;
padding: 20px;
background-color:orange;
}
</style>
</head>
<body>
<div>
<h3>jQuery Tutorial</h3>
</div>
<br>
<button type="button">Add Class</button>
<script>
$(document).ready(function(){
$("button").click(function(){
$("div").addClass("container");
});
});
</script>
</body>
</html>

Output :-

How to add class in jQuery

jQuery Tutorial

How to remove class in jQuery

File name : index.php

<!DOCTYPE html>
<html lang="en">
<head>
<script src="https://code.jquery.com/jquery-1.12.4.min.js"></script>
<meta charset="utf-8">
<title>How to remove class in jQuery</title>
<style>
.container {
width: 100%;
border: 4px solid green;
padding: 20px;
background-color:orange;
}
</style>
</head>
<body>
<div class="container">
<h3>jQuery Tutorial</h3>
</div>
<br>
<button type="button">Remove Class</button>
<script>
$(document).ready(function(){
$("button").click(function(){
$("div").removeClass("container");
});
});
</script>
</body>
</html>

Previous Next

Review & Rating

0.0 / 5

0 Review

5

(0)

4

(0)

3

(0)

2

(0)

1

(0)