add a class by clicking

What i intend to do is that i want to add a class to the nav by clicking at the hamburguer-menu icon. Then i want to remove that class by clicking at the close icon.
Could anyone tell me why is this not working?

HTML:

<nav class="nav container" id="nav">
            
            
            <h2 class="nav_logo"><a href="#logo">DaniStor</a></h2>    
            
            
            <ul class="nav_links"> 
                <li><a href="#sobre-mi" class="nav_sobre-mi">Sobre mí</a></li>
                <li><a href="#habilidades" class="nav_conocimiento link">Habilidades</a></li>
                <li><a href="#proyectos" class="nav_proyectos link">Proyectos</a></li>
                <!-- <li><a href="#contacto" class="nav_contacto">Contacto</a></li> -->
            </ul>    
        
        
            <div class="nav_idiomas">
                <div class="idioma español">
                    <img src="portafolio-es/img/español.png">
                </div>
                <div class="idioma english">
                    <a href="portafolio-en/index.html">
                    <img src="portafolio-en/img/english.png">
                    </a>
                </div>
            </div>
    
        
            <!--MENU HAMBURGUESA-->
            
                <a href="#nav" class="nav_hamburguer" onclick="clickOpen()">
                    <i class="fa-solid fa-bars nav_icon"></i>
                </a>

                <a href="#" class="nav_close" onclick="clickClose()">
                    <i class="fa-solid fa-x nav_icon"></i>
                </a>
          
      

        </nav>

JS:

function clickOpen() {
    const nav = document.querySelector('nav');
    nav.classList.add('open');
}

function clickClose() {
    const nav = document.querySelector('nav');
    nav.classList.remove('open');
}