Add class to element based on body id
I'm trying add a class to a particular list element based on the id of the
body but am not sure how to do so. Here's what I have so far:
document.addEventListener("DOMContentLoaded", function() {
var navbar = "<div class='nav'><ul class='nav'><li><a
href='#{{link}}'>{{name}}</a></li>{{/each}}</ul></div>"
template_nav = Handlebars.compile(navbar);
var navlinks = [{link:"home", name:"Home"},{link:"about", name:"About
Us"}, {link:"contact", name:"Contact Us"}];
document.querySelector("#nav").innerHTML = template_nav({links:
navlinks});
var bodyId = document.body.id;
});
What I'm trying to do exactly is that if the body id is e.g. "contact", I
want the list element containing the link to "#contact" to have a class
"active". I can't really just search through all the "a" tags, because
there may be more a elements with the same links and I only need to add
the class to links in the "nav" div, but I'm not exactly sure how to do
that. Any help or links to relevant documentation would be really
appreciated
No comments:
Post a Comment