Uncaught ReferenceError: myfunction is not defined


#1

I have an error here on my script.
When I click on the dropdown button I got this error: Uncaught ReferenceError: myfunction is not defined
this is the script

/* 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.getElementsByClassName("dropdown-content");
    var i;
    for (i = 0; i < dropdowns.length; i++) {
      var openDropdown = dropdowns[i];
      if (openDropdown.classList.contains('show')) {
        openDropdown.classList.remove('show');
      }
    }
  }
}

this is the html

<div class="dropdown">
  <button onclick="myFunction()" class="dropbtn">Temporada&nbsp;&nbsp;<span class="seta-baixo"></span></button>
  <div id="myDropdown" class="dropdown-content">
    <a href="#temp1">Temporada 1</a>
    <a href="#temp2">Temporada 2</a>
  </div>
</div>