W3 Mind Logo
Home » Add and remove class onClick

Add and remove class onClick

Just add this jQuery library in the header of your page.
				
					<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
				
			
Add this JavaScript code in the footer of your page.
				
					<script type="text/javascript">
  jQuery(".my_menu li").click(function (e) {
  jQuery(this).addClass("my_current_page_item").siblings().removeClass("my_current_page_item");
  });
</script>
				
			
This is the HTML code.
				
					<div class="my_menu">
  <ul>
  <li class="page_item">Item 01</li>
  <li class="page_item">Item 02</li>
  <li class="page_item">Item 03</li>
  <li class="page_item">Item 04</li>
  <li class="page_item">Item 05</li>
  </ul>
</div>
				
			

Example:

  • Item 01
  • Item 02
  • Item 03
  • Item 04
  • Item 05
About Author
Picture of W3Mind

W3Mind

W3Mind focuses on Blogging, Make Money Online, SEO, Business Blogging, Social Media, WordPress, Internet Tools, Web Design and Development.
Give it a Share
Facebook
Twitter
LinkedIn
You May Also Like
How to
START A
BLOG
(step by step)
Load WordPress Sites in as fast as 37ms!