如何使用顺风css在同一个html页面上选择多个按钮选项？

<link rel="stylesheet" href="https://cdn.example.com/shunfeng.css">

<button id="option1">Option 1</button>
<button id="option2">Option 2</button>
<button id="option3">Option 3</button>

#option1 {
  background-color: blue;
  color: white;
}

#option2 {
  background-color: red;
  color: white;
}

#option3 {
  background-color: green;
  color: white;
}

// 获取按钮选项的DOM元素
var option1 = document.getElementById("option1");
var option2 = document.getElementById("option2");
var option3 = document.getElementById("option3");

// 添加点击事件监听器
option1.addEventListener("click", function() {
  option1.classList.toggle("selected");
});

option2.addEventListener("click", function() {
  option2.classList.toggle("selected");
});

option3.addEventListener("click", function() {
  option3.classList.toggle("selected");
});

.selected {
  border: 2px solid yellow;
}