Estoy tratando de ocultar un contenedor cuando se hace clic en la barra de búsqueda, pero la página se vuelve a cargar y el contenedor se muestra nuevamente.

el codigo esta abajo

 <div class="search"> <form action="" method="GET"> <input type="text" name="search" value="" placeholder="search member.."> <button class="search_btn"> <i class="fas fa-search" style="font-size: 18px;"></i> </button> </form> </div>

el javascript para agregar la clase de ocultar

 const search_btn=document.querySelector(".search_btn"); const content=document.querySelector(".content"); search_btn.addEventListener("click", search); let se=false; function search(){ if(!se){ content.classList.add("hide"); se=true; }else{ content.classList.remove("hide"); se=false; } }

y la parte css de itis como se muestra a continuación

 .container .content.hide{ display:none; } .container .content{ display: block; margin: 20px; background: #f2f5f9; }