如何在选择框的第一项被选中时将颜色变为灰色

<select id="mySelect">
  <option value="1" selected>第一项</option>
  <option value="2">第二项</option>
  <option value="3">第三项</option>
</select>

#mySelect option[selected] {
  color: gray;
}

<select id="mySelect" onchange="changeColor()">
  <option value="1" selected>第一项</option>
  <option value="2">第二项</option>
  <option value="3">第三项</option>
</select>

function changeColor() {
  var selectElement = document.getElementById("mySelect");
  var selectedOption = selectElement.options[selectElement.selectedIndex];
  if (selectedOption.value === "1") {
    selectedOption.style.color = "gray";
  }
}