汉堡菜单无法切换

问：

在移动视图中，汉堡包在按下时不会切换到菜单项

我尝试对 CSS .responsive 代码重新排序，但它不起作用

nav > ul > li {
  list-style-type: none;
  padding: 10px;
  line-height: 0.8;
}
nav > ul > li > a {
  /*selects the list elements in the navigation class */
  padding: 0 10px;
  text-transform: uppercase;
  font-weight: 700;
  color: #ffffff;
  width: 100%;
}
nav > ul > li > a:visited {
  color: #ffffff;
}
nav > ul > li > a:hover {
  color: #49cde4;
}
nav > ul > li > a:active {
  color: #535461 0.3;
}
.navtoggle {
  /* gives space between logo and menu*/
  display: flex;
  justify-content: space-between;
}
.navtoggle li:not(:last-child) {
  /* To remove the menu items in small screen */
  background-color: white;
  display: none;
}
.navtoggle.responsive nav {
  position: relative;
  padding: 24px 0 0;
  display: block;
}
.navtoggle li .icon {
  position: relative;
  padding-right: 0;
  top: 2px;
  font-size: 20px;
}
.navtoggle.responsive li:last-child {
  /*doesn't show hamburger when toggled*/
  display: none;
  padding: 0 0 10px;
}
.navtoggle.responsive li {
  /* Should toggle on the menu list */
  display: block;
  padding: 10px 0;
  text-align: right;
}
nav > ul {
  list-style-type: none;
  padding: 0;
}
ul > li {
  margin: 0;
  padding: 0;
}

这是 JavaScript

   function menuToggle() {
    var x = document.getElementById('myNavtoggle');
    if (x.className === 'navtoggle') {
        x.className += ' responsive';
    } else {
        x.className = 'navtoggle';
    }
  }

这是 HTML

          <nav>
            <ul class="navigation">
              <li><a href="index.html">Portfolio</a></li>
              <li><a href="about.html">About Me</a></li>
              <li><a href="cira.html">CIRA</a></li>
              <li><a href="contactme.html">Contact me</a></li>
              <li>
                <a
                  href="javascript:void(0);"
                  class="icon"
                  onclick="menuToggle()">
                  <img src="img/portfolio/bars-solid.svg"
                  style="width: 48px; height: 48px" alt="menu icon">
                </a>
              </li>
            </ul>
          </nav>

当我测试 index.html 文件时，它显示未定义 myToggle 的错误。我试图找到错误，但我不知所措，找不到我出错的地方。