如何在单击一个时折叠其他手风琴内容？

<div class="accordion">
  <div class="accordion-item">
    <div class="accordion-header" onclick="toggleAccordion(1)">手风琴项 1</div>
    <div class="accordion-content">手风琴项 1 的内容</div>
  </div>
  <div class="accordion-item">
    <div class="accordion-header" onclick="toggleAccordion(2)">手风琴项 2</div>
    <div class="accordion-content">手风琴项 2 的内容</div>
  </div>
  <div class="accordion-item">
    <div class="accordion-header" onclick="toggleAccordion(3)">手风琴项 3</div>
    <div class="accordion-content">手风琴项 3 的内容</div>
  </div>
</div>

.accordion-content {
  display: none;
}

function toggleAccordion(itemIndex) {
  var accordionItems = document.getElementsByClassName('accordion-item');
  var accordionContents = document.getElementsByClassName('accordion-content');
  
  // 隐藏所有手风琴项的内容
  for (var i = 0; i < accordionContents.length; i++) {
    accordionContents[i].style.display = 'none';
  }
  
  // 显示当前点击的手风琴项的内容
  accordionContents[itemIndex - 1].style.display = 'block';
}