


Programs in jQuery
19. Toggle two CSS classes.<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>Untitled Document</title> <style> h3{ width:300px; border:1px solid #CCC; text-align:center; cursor: pointer; cursor: hand; margin-bottom:20px; } .clr1{ background-color:#CCF; color:#60F; } .clr2{ background-color:#FC3; color:#360; } </style> <script src="jquery-1.10.2.min.js"></script> <script> $(document).ready(function() { $("p").addClass("clr1"); $("h3").click(function(){ $("p").toggleClass("clr1 clr2"); }); }); </script> </head> <body> <h3>Click to toggle CSS classes</h3> <p>jQuery is a fast, small and feature-rich <b>JavaScript</b> library.</p> <p>'Write less: Do more'</p> </body> </html>Output :
Click to toggle CSS classes
jQuery is a fast, small and feature-rich JavaScript library.
'Write less: Do more'