Toggling Between Active and Not Active

JavaScript
1

I am trying to set the navigation tabs to active when I click on the tab. The code that I have here makes the tab active but when I mouse away from the tab and click on another tab, it remains active. How do I get it to become inactive when I go to another tab?

var navbar = document.getElementById("navbar__list");
var tabs = document.getElementsByTagName("li");
for (var i = 0; i < tabs.length; i++) {
  tabs[i].addEventListener("click", function() {
  var current = document.getElementsByClassName("active");
  current[0].className = current[0].className.replace(" active", "");
  this.className += " active";
  });
}
1 Like
2

This will likely cause problems:

current[0].className = current[0].className.replace(" active", "");

You have an extra space before active.

1 Like
3

I took away the blank space before active and now it works.

1 Like
4

Hey, i’m a student and i’m learning about coding, i want to be a software engineer, can you show i little bit of that please. Thank you…

5

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.