Note
addClass() function used to add the class dynamically to the elements.
Example: 1 when you click first element class added to the second element.
Related Topic:
removeClass() function used to remove the class dynamically to the elements.
Example: 2 When you click first element the class removed from the second element.
|
Example: 1 when you click first element class added to the second element
<html>
<head>
<title>HTML-JQuery</title>
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>
<script type="text/javascript">
$(document).ready(function () {
$(".one").click(function () {
$(".two").addClass('selected');
});
});
</script>
<style>
.selected {
color: red;
font-size: 20px;
}
</style>
</head>
<body>
<div class="one">click here to add class name 'selected' with next element</div>
<div class="two">After click the element the selected class css applied here</div>
</body>
</html>
|
Example: 2 When you click first element the class removed from the second element
<html>
<head>
<title>HTML-JQuery</title>
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>
<script type="text/javascript">
$(document).ready(function () {
$(".one").click(function () {
$(".two").removeClass('selected');
});
});
</script>
<style>
.selected {
color: red;
font-size: 20px;
}
</style>
</head>
<body>
<div class="one">click here to add class name 'selected' with next element</div>
<div class="two selected">After click the element the selected class css applied here</div>
</body>
</html>
|
Example: 1 Demo
|
Example: 2 Demo
|