title: JS animation only effects one element and it barely works
body: <p>I'm trying to make an animation for my dropdown mega menu and I came up to a problem where it only works when I hover over customizer buttom, slowly. I can't figure out why. Can someone more experienced with JavaScript help me?
  Here's my JavaScript code, full code (html,scss) can be found <a href="https://codepen.io/Arconi/pen/bGoXKzp" rel="nofollow noreferrer">here</a> (codepen link):</p>
  <pre><code>const button = document.querySelector(&quot;.dropdown&quot;);
  button.addEventListener(&quot;mouseenter&quot;, (e) =&gt; {
    document
      .querySelector(&quot;.dropdown-content&quot;)
      .classList.toggle(&quot;scale-up-ver-top&quot;);
  });
  </code></pre>