根据其他下拉菜单的值更改下拉框文本

Question

到目前为止，我有一些代码可以根据上一个下拉框中选择的值禁用下拉组合框。但是，我也想同时将禁用框中显示的文本从“选择一个”更改为“仅使用电子邮件”（或仅“电子邮件”，即使DOM选择该选项）。禁用它。到目前为止，我还无法弄清楚如何做到这一点。以下是有效的代码，需要进行一些修改才能更改显示的文本：

HTML-1st Drop Down:
<select class="rounded" name="cboBestCallingPeriod" id="cboBestCallingPeriod">
  <option value="Choose One">Choose One</option>
  <option value="Use Email Only">Use Email Only</option>
  <option value="8:00AM - Noon">8:00AM - Noon</option>
  <option value="Noon - 1:00PM">Noon - 1:00PM</option>
  <option value="1:00PM - 3:00PM">1:00PM - 3:00PM</option>
  <option value="5:00PM - 6:00PM">5:00PM - 6:00PM</option>
  <option value="6:00PM - 8:00PM">6:00PM - 8:00PM</option>
</select>   


HTML-2nd Drop Down:
<select class="rounded" name="cboPreferredContactMethod" id="cboPreferredContactMethod">
  <option value="Choose One">Choose One</option>
  <option value="E-mail">E-mail</option>
  <option value="Phone">Phone</option>
</select>

JAVASCRIPT:
<script type="text/javascript">
  let select = document.getElementById("cboBestCallingPeriod");
  let inputvalue = document.getElementById("cboPreferredContactMethod");
                        
  select.addEventListener("change", function () {
     inputvalue.disabled = select.value == "Use Email Only";
   });
</script>