Question

I am trying to use the menuBar object I’ve defined before to do a manipulation on objects within.

var menuBar = $(".menu-bar ul");
var menuActive = menuBar.find("li.active");
menuBar.hover(function(){
    menuActive.toggleClass("active");
});
$('.menu-bar ul > li > a[href="'+ window.location.href +'"]').parent().addClass("active"); 

What I do not like is to call the DOM search once more to define the active class for link parent.

Any thoughts on how to do it with menuBar variable?

Answer 1

try something like this

var menuBar = $(".menu-bar ul");
var menuActive = menuBar.find("li.active");
menuBar.hover(function(){
    menuActive.toggleClass("active");
});
$('li > a[href="'+ window.location.href +'"]',menuBar).parent().addClass("active");