JSFiddle - React, Tailwind, and code Playground
HTML
<div class="all">
<p id="p1">normal text (hover it!)</p>
<p id="p1" class="otherclass">blue text (hover it!)</p>
<p id="p2" class="disabled">disabled text</p>
<p id="p3">* normal text , but jquery disabled</p>
<p id="p4" class="disabled">* disabled text, and jquery enebled! </p>
</div>
CSS
p:hover {color: red; cursor: pointer;}
.disabled:hover {color: inherit; cursor: auto}
.otherclass {color:blue}
JavaScript
$('#p3').addClass("disabled");
$('#p4').removeClass("disabled");