Addclass to Menu JQuery

Question

Я пытаюсь добавить класс динамически в меню, которое у меня есть на моем веб-сайте, который строится следующим образом.

<nav> 
    <ul id="" class="mini-menu"> 
     <li><a href="home">Home</a></li> 
     <li><a href="over-jellyfish">Over Jellyfish</a></li> 
     <li><a href="blog">Blog</a></li> 
     <li class="contact"><a href="contact">Contact</a></li> 
    </ul> 
    <ul class="hoofd-menu"> 
     <li class="websites"><a id="dekstop_menu" href="websites"><i class="fa fa-desktop text-center"></i>Websites</a></li> 
     <li class="support"><a id="support_menu" href="support"><i class="fa fa-comment-o text-center"></i>Support</a></li> 
    </ul> 
</nav> 

с JQuery Я пытаюсь добавить класс к мини-меню, выполнив следующие шаги.

jQuery(function() { 
    var str = window.location.pathname; 
    var page = str.split("/"); 
    p=page[2]; 
    var active = p=page[2]; 
    console.log(active); 

    jQuery('.mini-menu a').each(function() { 
     if (jQuery(this).attr('href') === active) { 
      jQuery(this).addClass('active'); 
     } 
    }); 
}); 

Однако я, кажется, что-то пропустил, потому что в html ничего не появляется, добавляя класс к ссылке. Я упускаю из виду тот факт, что ссылка не является прямым ребенком класса mini-nav? Если да, то как это исправить?

Answer 1

Вы можете попробовать это:

jQuery(function() { 
    var str = window.location.pathname; 
    var page = str.split("/"); 
    p=page[2]; 
    var active = p=page[2]; 
    console.log(active); 

    jQuery('.mini-menu a').each(function() { 
     (function (self) { 
     if (jQuery(self).attr('href') === active) { 
      jQuery(self).addClass('active'); 
     } 
     })(this); 
    }); 
});