jQuery hover() swap class

jQuery hover() swap class

by Harsh Bhatnagar

HTML

<p class="green">Hover to toggle</p>
<p class="green red">red</p>
<p class="green ">on these</p>
<p class="green red">paragraphs</p>

CSS

p {
     margin: 4px;
     font-size: 14px;
     font-weight: bolder;
     cursor: pointer;
     padding: 4px;
 }
 
 .green {
     color: green;
 }
 
 .red {
     background: red;
     color: #fff;
 }

JavaScript

$("p").hover(function() {
    $(this).toggleClass("red");
});