0
var mainNav = document.getElementsByClassName("js-menu");
var navBarToggle = document.getElementById("js-navbar-toggle");

navBarToggle.addEventListener("click", function() {
   console.log(mainNav);
      for (var i = 0; i `enter code here`<= mainNav.length; i++) {
    console.log(mainNav[i]);
    mainNav[i].classList.toggle("responsive");
  }
});
MrGeek
  • 19,520
  • 4
  • 24
  • 49
shara
  • 1
  • 1
    Please, read **How to ask** (https://stackoverflow.com/help/how-to-ask) first, and rephrase your question, so others can help you. – muka.gergely Sep 04 '19 at 17:47
  • Possible duplicate of [Why does jQuery or a DOM method such as getElementById not find the element?](https://stackoverflow.com/questions/14028959/why-does-jquery-or-a-dom-method-such-as-getelementbyid-not-find-the-element) – Su Llewellyn Sep 04 '19 at 18:39

1 Answers1

0

Shara, you are using <= and should be <

Thats happens when you are running Array but initial position is 0 and the last one is array.length - 1

Because of it you should compare using <

var mainNav = document.getElementsByClassName("js-menu");
var navBarToggle = document.getElementById("js-navbar-toggle");

navBarToggle.addEventListener("click", function() {
   console.log(mainNav);
      for (var i = 0; i < mainNav.length; i++) {
    console.log(mainNav[i]);
    mainNav[i].classList.toggle("responsive");
  }
});

Or maybe compare using:

var mainNav = document.getElementsByClassName("js-menu");
var navBarToggle = document.getElementById("js-navbar-toggle");

navBarToggle.addEventListener("click", function() {
   console.log(mainNav);
      for (var i = 0; i <= mainNav.length - 1 ; i++) {
    console.log(mainNav[i]);
    mainNav[i].classList.toggle("responsive");
  }
});
Matheus Mello
  • 170
  • 1
  • 4