Javascript Não sei porque meu codigo não está funcionando

[machidaftw]

Fala pessoal eu estou tentando adicionar uma classe a uma div do meu html pelo javascript, porém minha function não está funcionando e eu gostaria de saber o motivo.

 

<<<<<<Aqui está o frame do meu html>>>>>

 

<div class="icon icon-arrow-circle-right"></div>
      <nav>
        <div class="leftMenu">
          <ul>
            <li><a href="#">start</a></li>
            <li><a href="#">Introduction</a></li>
            <li><a href="#">Body</a></li>
            <li><a href="#">Conclusion</a></li>
            <li><a href="#">Bottom</a></li>
          </ul>
        </div>
      </nav>

 

<<<<Aqui está o frame do meu Javascript>>>>

 

var botão = document.getElementsByClassName("icon icon-arrow-circle-right");
var menu = document.getElementsByClassName("leftMenu");

for (var element of botão) {
  element.addEventListener("click", function () {
    menu.classList.toggle('show')
  });
}

 

[thefill]

Oi @machidaftw como vai?

 

Se eu entendi bem você quer que quando pressionado o botão altere adicionando ou removendo a classe show em uma div, acredito que eu tenha conseguido dessa forma, veja ai: Aplicação rodando, Código da aplicação

[washalbano]

Olá!
Supondo que o for foi usado para uma possível coleção de elementos com a mesma class
E supondo que todos seguem o mesmo pattern
sugiro que use nextElementSibling, assim:
 

// coleção de elementos
const botao = document.getElementsByClassName("icon icon-arrow-circle-right");

for (const element of botao) {
    element.addEventListener("click", function () {
        // coleção de elementos
        const menu = element.nextElementSibling.getElementsByClassName("leftMenu")
        // altera a class apenas do primeiro elemento encontrado com a class leftMenu
        menu[0].classList.toggle('show')
    });
}

Dessa maneira, quando cada "botão" com as classes .icon.icon-arrow-circle-right for clicado,
serão buscados os elementos .leftMenu dentro de outro elemento html(que no exemplo html é o <nav>) que esteja imediadamente após o botão clicado.

[machidaftw]

@washalbano eu tentei o seu código e o código acima, porém ainda não consegui fazer o elemento mudar de classe.

[machidaftw]

Descobri o problema e era a coisa mais boba do mundo!!!
Como eu estava colocando o script no head ele não estava funcionando, dai eu coloquei no final do body e ele funcionou normal.