如何使用一个按钮来改变其他按钮的样式？

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

.button {
  background-color: #ccc;
  color: #fff;
  padding: 10px 20px;
  border: none;
  cursor: pointer;
}

.button.active {
  background-color: #ff0000;
}

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

button1.addEventListener("click", function() {
  button2.classList.remove("active");
  button3.classList.remove("active");
  button1.classList.add("active");
});

button2.addEventListener("click", function() {
  button1.classList.remove("active");
  button3.classList.remove("active");
  button2.classList.add("active");
});

button3.addEventListener("click", function() {
  button1.classList.remove("active");
  button2.classList.remove("active");
  button3.classList.add("active");
});