Using jQuery addClass not working
Hi all,
I'm trying to use jQuery to target the current URL and dynamically add the 'active' class to the <a> tag in our global navigation. I've nicked the existing blog page layout to create a new section and the Freemarker page.name value was returning the same for both sections, so I was unable to use Freemarker to add the class from what I can see.
On with my point - I've written the following jQuery and chucked it into an <@liaAddScript> tag in the Hitbox section of our wrapper. However, it's not working!
;(function($) {
$(document).ready(function() {
if (window.location.href.indexOf("Digital-life") > -1) {
$('#blogMenu').addClass('active');
console.log("Digital Life");
} else if (window.location.href.indexOf("News") > -1) {
$('#newsMenu').addClass('active');
console.log("News");
} else {
console.log("Failure");
}
console.log($('#newsMenu'))
});
})(LITHIUM.jQuery);I added the various console.log() statements to test whether the if / else was evaluating to true. When I run the final console log to query the #newsMenu ID it's actually showing it has a class of 'active', but the HTML isn't changing and as a result the menu isn't displaying the desired styling.
I believe the if / else is working correctly, just something to do with what's contained in there not working (apart from the console.log). Has anybody encountered similar? Or can recommend any steps to take to get this working? I've even checked it with a Back-End Developer friend of mine and he's flummoxed, so hoping it's to do with something on the Lithium platform.
Thanks,
Kev
Hi Kev_B
not sure why this would not work without seeing the actual full page etc.
However - I am assuming you want to highlight the area within the community structure the user is in. In that case, have you checked out the coreNode context object in Freemarker? You should be able to do this in a much easier way by using ${coreNode.id} (and possibly other properties of that object) to detect the node you are in and highlight the appropriate value without inspecting the page URL.
Hope it helps,
