JavaScript 탭 만들기

<div class="container mt-5">
      <ul class="list">
        <li class="tab-button">Products</li>
        <li class="tab-button">Information</li>
        <li class="tab-button">Shipping</li>
      </ul>
      <div class="tab-content">
        <p>상품설명입니다. Product</p>
      </div>
      <div class="tab-content">
        <p>스펙설명입니다. Information</p>
      </div>
      <div class="tab-content">
        <p>배송정보입니다. Shipping</p>
      </div>
</div>

let classCount = document.querySelectorAll(".tab-button").length;
let btn = document.querySelectorAll(".tab-button");
let content = document.querySelectorAll(".tab-content");

for (let i = 0; i < classCount; i++) {
  btn[i].addEventListener("click", function () {
    for (let j = 0; j < classCount; j++) {
      btn[j].classList.remove("orange");
      content[j].classList.remove("show");
    }
    btn[i].classList.add("orange");
    content[i].classList.add("show");
  });
}