如何在单击另一个按钮时突出显示另一个按钮

<button id="button1">按钮1</button>
<button id="button2">按钮2</button>

button {
  /* 默认状态样式 */
  background-color: #ccc;
  color: #fff;
  border: none;
  padding: 10px 20px;
  cursor: pointer;
}

button:hover {
  /* 鼠标悬停时的样式 */
  background-color: #aaa;
}

var button1 = document.getElementById("button1");
var button2 = document.getElementById("button2");

button1.addEventListener("click", function() {
  // 移除按钮2的突出显示样式
  button2.classList.remove("highlight");
  
  // 添加按钮1的突出显示样式
  button1.classList.add("highlight");
});

button2.addEventListener("click", function() {
  // 移除按钮1的突出显示样式
  button1.classList.remove("highlight");
  
  // 添加按钮2的突出显示样式
  button2.classList.add("highlight");
});