如何在javascript中实现多个按钮的“点击显示”功能？

<button id="btn1">按钮1</button>
<div id="content1">内容1</div>

<button id="btn2">按钮2</button>
<div id="content2">内容2</div>

<!-- 添加更多按钮和内容区域 -->

div[id^="content"] {
  display: none;
}

// 获取按钮和内容区域的引用
var btn1 = document.getElementById("btn1");
var content1 = document.getElementById("content1");

var btn2 = document.getElementById("btn2");
var content2 = document.getElementById("content2");

// 添加点击事件监听器
btn1.addEventListener("click", function() {
  // 切换内容区域的显示状态
  if (content1.style.display === "none") {
    content1.style.display = "block";
  } else {
    content1.style.display = "none";
  }
});

btn2.addEventListener("click", function() {
  // 切换内容区域的显示状态
  if (content2.style.display === "none") {
    content2.style.display = "block";
  } else {
    content2.style.display = "none";
  }
});

// 添加更多按钮的事件处理