Add Active Navigation Class to Menu Item Based on URL Using jQuery

John Morris
jQuery Code Snippets
Oct 9, 2015

In this jQuery tutorial, you’ll learn how to add an active class to a menu item based on the page URL using jQuery… so you can highlight that menu item. You’ll learn:

  • how to use the jQuery addClass() method
  • how to get the current page’s URL path in JavaScript
  • how to split a URL in an array of parts
  • how to use the JavaScript pop() method
  • how to target an element based the value of a specified attributed using jQuery

Ready to start making money with your development skills? This free training will help you to jumpstart your freelance career.

Here’s the code I used in the video:

If you get value from this code snippet, please consider sharing it with another developer or group who could benefit from it.

Originally published at John Morris.

--

--

John Morris
jQuery Code Snippets

I’m a web designer who helps other web designers with two things: 1) how to code and 2) how to market yourself so you can earn your living as a coder.