左键单击列表元素并隐藏其余元素

<ul id="myList">
  <li onclick="toggleElement(0)">元素1</li>
  <li onclick="toggleElement(1)">元素2</li>
  <li onclick="toggleElement(2)">元素3</li>
  <li onclick="toggleElement(3)">元素4</li>
</ul>
<div id="content">
  <p>元素1的内容</p>
  <p>元素2的内容</p>
  <p>元素3的内容</p>
  <p>元素4的内容</p>
</div>

#content p {
  display: none;
}

#content p.active {
  display: block;
}

function toggleElement(index) {
  var elements = document.getElementById("content").getElementsByTagName("p");
  for (var i = 0; i < elements.length; i++) {
    elements[i].classList.remove("active");
  }
  elements[index].classList.add("active");
}