如何让点击的li高亮显示

<ul>
  <li class="list-item">Item 1</li>
  <li class="list-item">Item 2</li>
  <li class="list-item">Item 3</li>
</ul>

// 获取所有li元素
var listItems = document.querySelectorAll('.list-item');

// 为每个li元素添加点击事件监听器
listItems.forEach(function(item) {
  item.addEventListener('click', function() {
    // 移除所有li元素的高亮状态
    listItems.forEach(function(li) {
      li.classList.remove('active');
    });

    // 添加当前点击的li元素的高亮状态
    this.classList.add('active');
  });
});

.active {
  background-color: yellow;
}