Highlight the active menu item

Sometimes installed menu plugins for various CMS do not have such a simple thing as highlighting the active menu item. After long and tedious wanderings on Google on one of the resources, I found this code that will help fix this situation

$(function () {
    var location = window.location.href;
  
    $('.menu li').each(function () {
        var link = $(this).find('a').attr('href');
  
        if (location.indexOf(link) !== -1)
        {
            $(this).addClass('current');
        }
    });
});

where ".menu" is the class of our list <ul> menu, and "current" is the class to add for the active list <li> element. Thus, in the future, you can set the necessary styles for the existing class.

Plain text

  • No HTML tags allowed.
  • Lines and paragraphs break automatically.
  • Web page addresses and email addresses turn into links automatically.
The comment language code.