Student new to HTML, CSS, and JavaScript and I have a question about JavaScript!

Hello! I have a question about my JavaScript. I found a few snippets of code online and tried them on my student web page. Everything seems to work great except for my dropdown Menu button that I got from W3 Schools. The problem is it opens, but it won’t close after clicking onto my webpage. Here is the html and javascript. I’m including the script that “animates link jumps” because there’s an error in the console. I’m wondering if that error is somehow stopping the script from running through completely or is there something wrong with the button script? I’m not really sure quite yet. I’m brand new (5 weeks in) and we haven’t even covered css in class. So this is just me trying get in a little extra studying. If you look at this, THANK YOU!

HTML:

<body>
  <div class="dropdown">
    <button onclick="myFunction()" class="dropbtn"><b>MENU</b></button>
    <div id="myDropdown" class="dropdown-content">

      <nav class="nav">
        <a href="#about">About</a>&nbsp;&nbsp;&nbsp;&nbsp;
        <a href="#assignments">Assignments</a>&nbsp;&nbsp;&nbsp;&nbsp;
        <a href="#work_education">Work Education</a>&nbsp;&nbsp;&nbsp;&nbsp;
        <a href="#getting_started">Getting Started</a>&nbsp;&nbsp;&nbsp;&nbsp;
        <a href="#resources">Helpful Links</a>&nbsp;&nbsp;&nbsp;&nbsp;
        <a href="#contacts">Contacts</a>

      </nav>
    </div>
  </div>

JavaScript:

//Animates Link Jumps//

YUI().use('anim', function(Y) {
    var anim = new Y.Anim({
      duration: 0.8,
      node: 'win',
      easing: 'easeBoth',
      to: {
        scroll: [0, 0]
      }
    });
    Y.one('.backtotop').on('click', function(e) {
      e.preventDefault();
      anim.run();
    });

  });

  /* When the user clicks on the button,
  toggle between hiding and showing the dropdown content */
  function myFunction() {
      document.getElementById("myDropdown").classList.toggle("show");
  }


  // Close the dropdown menu if the user clicks outside of it//
  window.onclick = function(event) {
    if (!event.target.matches('.dropbtn')) {

      var dropdowns = document.querySelector("dropdown-content");
      var i;
      for (i = 0; i < dropdowns.length; i++) {
        var openDropdown = dropdowns[i];
        if (openDropdown.classList.contains('show')) {
          openDropdown.classList.remove('show');
        }
      }
    }
  }

MC, I have a similar question re CSS, Javascript and HTML. Did NO ONE respond to you?