jquery if link = page url

Question

ok pretty simple but i dont know how...

i just want to make an active state (probably just make it bold)

my menu is ul-li

i cant figure out how to write it so if the url matches with one of the links, make the link bold

please help

thanks for your time

Answer 1

Here's a short way to select links like that:

$('ul > li a[href$="' + window.location.pathname + '"]').css('font-weight','bold');

Or perhaps better like this, which does an exact match of both pathname attributes:

$('ul > li a[href]').filter(function() {
    return this.href.pathname === window.location.pathname;
}).css('font-weight','bold');

If you're using the full domain in the href , you could change it to:

return this.href === window.location;

Answer 2

Here is a great solution I have used:

$(function(){
       $("a").each(function(){
               if ($(this).attr("href") == window.location.pathname){
                       $(this).addClass("selected");
               }
       });
});

Source - https://css-tricks.com/snippets/jquery/highlight-all-links-to-current-page/