<button class="eng-btn eng-header-btn js-toggle-menu" aria-expanded="false">
  <span class="js-toggle-menu--closed">
    <span class="fa fa-bars header-icon"></span>
    <span class="sr-only">Öppna </span>Meny
  </span>

  <span class="js-toggle-menu--open" style="display: none;">
    <span class="fa fa-times header-icon"></span>
    STÄNG<span class="sr-only"> meny</span>
  </span>
</button>

<script>
svDocReady(function() {
  const toggleButton = document.querySelector('.js-toggle-menu');
  const menu = document.querySelector('.ham-menu');
  const wrapper = menu.parentElement;
  const overlay = document.querySelector('.overlay');
  const closedContent = document.querySelector('.js-toggle-menu--closed');
  const openContent = document.querySelector('.js-toggle-menu--open');

  menu.setAttribute('aria-hidden', 'true');

  const toggleButtonContent = function () {
    if (closedContent.style.display === 'none') {
      closedContent.style.display = 'block';
      openContent.style.display = 'none';
    } else {
      closedContent.style.display = 'none';
      openContent.style.display = 'block';
    }
  };

  const toggleAria = function () {
    menu.setAttribute('aria-hidden', !(menu.getAttribute('aria-hidden') === 'true'));
    toggleButton.setAttribute('aria-expanded', !(toggleButton.getAttribute('aria-expanded') === 'true'));
  };

  toggleButton.onclick = function () {
    $svjq(menu).css("left", "unset");

    $svjq('html, body').animate({ scrollTop: 0 }, 'fast');

    wrapper.classList.toggle("open");

    $svjq(".ham-menu-item")[0].focus();
    $svjq("body").toggleClass("noscroll");

    toggleButtonContent();
    toggleAria();

    if ($svjq(window).width() > 2000) {
      var rt = ($svjq(".ham.menubutton").offset().left);
      $svjq(".ham-menu").css("left", rt);
    }
  };

  overlay.onclick = function () {
    toggleButtonContent();
    toggleAria();
  };
});
</script>