x
1
2
3
4
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">5
<script src="../../../ajax/libs/jquery/1-11-3/jquery.min.js"></script>6
<script>7
$(document).ready(function(){8
$("button").click(function(){9
$("p").toggleClass("main");10
});11
});12
</script>13
<style>14
.main {15
font-size: 120%;16
color: green;17
}18
</style>19
<script>var clicky_site_ids = clicky_site_ids || []; clicky_site_ids.push(101319977);</script><script async src="//static.getclicky.com/js"></script>20
21
<button>Add or remove the styles</button> <h2>Toggle Effect</h2>22
<p>If you click the above button it will add green color style.</p>23
<p>If you click it second time, it will remove the style.</p>24
<b>Note:</b> Click the button more than once to see the toggle effect.25
26
27