如何使列表菜单显示时，它有活动的类？

<ul id="menu">
  <li><a href="#">菜单项1</a></li>
  <li><a href="#">菜单项2</a></li>
  <li><a href="#">菜单项3</a></li>
</ul>

.active {
  background-color: #f00;
  color: #fff;
}

// 获取所有菜单项
var menuItems = document.querySelectorAll('#menu li');

// 为每个菜单项添加点击事件监听器
menuItems.forEach(function(item) {
  item.addEventListener('click', function() {
    // 移除所有菜单项的活动类
    menuItems.forEach(function(item) {
      item.classList.remove('active');
    });

    // 为当前点击的菜单项添加活动类
    this.classList.add('active');
  });
});