Jquery Addclass Removeclass Example - Jquery

How to add and remove css style using jquery?

Snippet Code

Rate this page :
  [ 0 votes]

Jquery functions addstyle() and removestyle() are used to add or remove class from the HTML element. They are done through simple jquery addclass() and removeclass() methods.

<script type='text/javascript'> function addstyle(id,cls){ $("#"+id).addClass(cls); $("#add").css("display","none"); $("#remove").css("display","inline"); } function removestyle(id,cls){ $("#"+id).removeClass(cls); $("#remove").css("display","none"); $("#add").css("display","inline"); } </script> <style> .addcls { font-weight:bold; font-size:1.2em; color:yellow; background:green; border-radius: 25px; padding:10px; } </style> <div align='center'> <input type='button' id='add' value='Add Class' onclick="addstyle('am','addcls')"> <input type='button' id='remove' value='Remove Class' style='display:none;' onclick="removestyle('am','addcls')"> <div id='am' class='add' align='center'>Welcome to Hscripts.com!!!</div> </div>


Ask Questions

Ask Question