如何关闭兄弟LI元素的UL？

<ul id="mainList">
  <li>Item 1
    <ul>
      <li>Sub Item 1</li>
      <li>Sub Item 2</li>
    </ul>
  </li>
  <li>Item 2
    <ul>
      <li>Sub Item 3</li>
      <li>Sub Item 4</li>
    </ul>
  </li>
</ul>
<button id="closeButton">关闭所有子列表</button>

document.getElementById('closeButton').addEventListener('click', function() {
  // 获取主列表的所有子项
  var listItems = document.querySelectorAll('#mainList > li');
  
  // 遍历每个子项
  listItems.forEach(function(item) {
    // 查找当前子项下的第一个ul元素并移除它
    var subList = item.querySelector('ul');
    if (subList) {
      item.removeChild(subList);
    }
  });
});