あるselectの選択肢を選んだとき、別のselectの選択肢を選べないようにJQueryで制御したい

Question

実現したいこと

selectの中の選択肢を選んだ時、別のselectの選択肢をJQueryで選択不可にしたい。
id="selectDay" のselectの中の6/2をクリックすると、id="selectTime"のselectの選択肢10:00が選択不可（disabled）になるようにしたいのですが………

HTML

 <select name="day" id="selectDay">
     <option value="">日程を選んでください</option>
    <option value="6/2">6/2</option>
    <option value="6/3">6/3</option>
  </select>
  <select name="time" id="selectTime">
    <option value="">時間を選んでください</option>
    <option value="10:00">10:00</option>
    <option value="11:00">11:00</option>
  </select>

JQuery

$(function() {
  $("#selectDay option[value="6/2"]").change(function() {
    $("#selectTime option[value="10:00"]").prop("disabled", true);
  });
    });

Jqueryが初心者なので色々調べて実践してみたのですが、なかなかうまくいきません。
選択不可にしたい選択肢がdisabledされず、クリックもできてしまいます。

どなたかご教授のほどよろしくお願いいたします。

Answer 1

さきにtimeで10:00を選んだ後dayを6/2にしたらどうするのか次第ですね

$(function(){
  $('[name=day]').on('change',function(){
    $('[name=time] option[value="10:00"]').prop('disabled',$(this).val()=="6/2");
  });
});

Comments

[sunD-m]

ご提示いただいたやり方で試すとうまくいきました。勉強になりました。ありがとうございました。

Answer 2

引用符の対応が両方おかしいので、まずそこから試してみてください。

// "#selectDay option[value="6/2"]"
   ↓                              ↓
   '#selectDay option[value="6/2"]'

Comments

[sunD-m]

ご回答いただきありがとうございます。
コメントにあった部分を修正いたしましたが、まだうまく制御できていません。
現在Liveweaveでテストしているのですが、環境がよくないのでしょうか。