este es un código simple que ayuda a HTML a ejecutar un código que abrirá un cuadro-modal. Pero por alguna razón, no parece hacer nada mientras lo escribo en Vscode pero funciona perfectamente bien mientras lo escribo en 'code-pen'. por favor, dime ¿Por qué mi javascript no funciona así?

 //javascript const open = document.getElementById('click'); const Skill = document.getElementsByClassName('Skill'); open.addEventListener('click' , function() { Skill.classList.add('show'); });

 //html <nav class="nav-bar"> <div class="Logocontainer"> <h1 class="logo"><a href="#">T&S</a></h1> </div> <ul class="Menu"> <li><a href="#home">Home</a></li> <li><a href="#">Team</a></li> <li id="click"><a href="#" id="click">My Skills</a></li> <li><a href="#about me">About Me</a></li> </ul> </nav> });

 //css .Skill{ display: flex; margin-left: 500px; background-color: black; width: 800px; height: 200px; border-radius:10px; color: white; font-weight: bold; align-items: center; justify-content: center; display: none; } .Skill.show{ display:block; }