Comments by imothep85 (Top 2 by date)

I did some changes
Hide   Copy CodeHide   Copy Code

         <nav class="navbar">            <div class="logo">MY LOGO</div>            <a class="hamburger" >              <span class="bar"></span>              <span class="bar"></span>              <span class="bar"></span>            </a>            <div class="menu">            <ul>               <li><a href="#home">Home</a></li>              <li><a href="#about">About</a></li>              <li><a href="#donate">Donate</a></li>              <li><a href="#download">Download</a></li>              <li><a href="#howto">How</a></li>              <li><a href="#reports">Reports</a></li>              <li><a href="#contact">Contact</a></li>            </ul>          </div>          </nav>

and the jquery

Hide   Copy CodeHide   Copy Code

<script src="https://code.jquery.com/jquery-1.11.1.min.js"></script>    <script type="text/javascript">      $(document).ready(function(){          $('li.dropdown').click(function () {              $('li.dropdown').not(this).find('ul').hide();              $(this).find('ul').toggle();          });       });      </script>

but is not working !!
I dont want to change my css because the menu is already designed !
this is my menu : https://ibb.co/b18Phww

the only missing function in my code is for closing the menu when any li is clicked

const hamburger = document.getElementsByClassName('hamburger')[0]
const menu = document.getElementsByClassName('menu')[0]
hamburger.addEventListener('click', () => {
  menu.classList.toggle('active')
})