Question

Morning,

I must be asking google all the wrong questions, because I can’t find anything similar.

I have a standard navigation list, but I’m using page jumping because I wanted a single web page.

<ul>
<li><a href="#livestream">Livestream</a></li>
<li><a href="#media">Media</a></li>
<li><a href="#crew">Crew</a></li>
<li><a href="#services">Services</a></li>
<li><a href="#contact">Contact</a></li>
</ul>

But I can’t for the life of me figure out how to make the class=”current” when using page jumping. I’ve tried this bit of jquery because it appears to be what I’m looking for, but it did nothing. I don’t think it’ll work for #links.

Any ideas?

Answer 1

If you want to add the current-class to the a that has been clicked, you can accomplish it like this:

// Wait for the DOM to be ready
$(function(){
   // Add click-event listener
   $("li a").click(function(){
      // Remove the current class from all a tags
      $("li a").removeClass("current");
      // Add the current class to the clicked a
      $(this).addClass("current");
   });
});