How do you remove an active class?

How do you remove an active class?

Use document. querySelectorAll to find the element which currently have the active class, then you can remove that class.

How to add active Class to a navigation menu based on url?

JS

  1. jQuery(function($) {
  2. var path = window. location. href;
  3. // because the ‘href’ property of the DOM element is the absolute path.
  4. $(‘ul a’). each(function() {
  5. if (this. href === path) {
  6. $(this). addClass(‘active’);
  7. }

How do I add active class to my current page?

$(function() { $(‘nav li a[href^=”/’ + location. pathname. split(“/”)[1] + ‘”]’). addClass(‘active’); });

How do I make my href active?

A link becomes active when you click on it. Tip: The :active selector can be used on all elements, not only links. Tip: Use the :link selector to style links to unvisited pages, the :visited selector to style links to visited pages, and the :hover selector to style links when you mouse over them.

How to add or remove active class in jQuery?

Since the active class is in the element and what is clicked is the element, the first line removes .active from all and the second one (again, $ (this) represents which is the clicked element) adds .active to the direct parent, which is . Thanks for contributing an answer to Stack Overflow!

How can I select an active class in JavaScript?

Instead of iterating through the entire collection you can select the element which have a class active using document.queryselector. Also provide an id to the ul so that you can target the specific element

How can I add a class to an element in JavaScript?

I am trying to make a navigation menu I did all the HTML and CSS when come to javascript I am struck in the middle I am able to add a class to the element, but I am not able to remove the class remaining elements. Please help me with this.

How to add active class for UL list in JavaScript?

Test Page 1 Page 2 Page 3 this will point to the selected by .nav-list. You can use delegation instead! In your context $ (this) will points to the UL element not the Li.