jqueryuiのdatepicker で、カレンダーの曜日に応じてoptionタグから一部の時間帯しか選べないようにしたいです。

Question

前提

ここに質問の内容を詳しく書いてください。
（例）
WordpressのElementorにて、MWformでお問い合わせフォームを作っています。
その中でdatepicker のカレンダーで土曜日や平日（日曜日は）非表示にしています。を選ぶとカレンダー下の「ご希望の時間帯からお選びください」欄から一部の時間帯しか選べないようにしたいです。
jqueryでそのコードを書きたいです。
https://nayabashi-kick.com//form-test/
https://nayabashi-kick.com//form-test/

実現したいこと

-カレンダーの日にちをクリックしたら曜日を取得し曜日に応じて、optionタグの一部を選べないようにする

<script>
//日曜日を選択不可
 jQuery(function(){ jQuery('#datepicker').datepicker(); jQuery('#datepicker').datepicker('option','beforeShowDay',function(date){ var ret = [(date.getDay() != 0 && date.getDay() != 7)]; return ret; });});
 
    // jQuery(function() {
        
        // jQuery('#datepicker').datepicker(); jQuery('#datepicker').datepicker('option','beforeShowDay',function(date){ var ret = [(date.getDay() != 6 && date.getDay() != 7)]; return ['true', 'yasumi']; });
        
   
//         jQuery('#Date').datepicker({
// beforeShowDay: function(date) {
// if (date.getDay() == 6) {
// // クラス名を設定
// return [true, 'class-store-closed', ''];
// jQuery('option').hide();
// jQuery('select').addClass('saturdey');

// }
// }
// });
      
    // });

  

</script>

お名前

[mwform_text name="name" placeholder="name"]

ふりがな

[mwform_text name="name_kana" placeholder="ふりがな"]

電話番号

[mwform_text name="tel" placeholder="電話番号"]

メールアドレス

[mwform_text name="email"]

メールアドレス確認

[mwform_text name="email_check" ]

郵便番号

[mwform_text name="pcode"]

ご住所

[mwform_text name="adress"]

お問い合わせ内容

[mwform_radio name="select_form" id="select_form" class="select_form" children="お問合せ,体験希望" value="お問合せ"]

体験したい店舗を選択してください

[mwform_radio name="select_shop" id="select_shop" class="select_shop" children="納屋橋キック1号店" value=""]

希望日時
※体験の対応時間は下記の時間内でご入力下さい。
平日　18:00～22:00
土曜　15:00～18:00
祝日　15:00～20:00
日曜日は定休日となります。

[mwform_datepicker name="days" id="datepicker" size="30" placeholder="ご希望の日にちを選択してください"]
[mwform_select name="dateserect" id="希望日時" children="ご希望のお時間帯を選択してください,１５：００～１６：００,１６：００～１７：００,１７：００～１８：００,１８：００～１９：００,１９：００～２０：００,２０：００～２１：００,２１：００～２２：００" value=""]

お問合せ詳細

[mwform_textarea name="contents"]
[mwform_backButton value="戻る"]
[mwform_submitButton name="submit" confirm_value="確認する" submit_value="送信する "]

試したこと

// jQuery(function() {
    
    // jQuery('#datepicker').datepicker(); jQuery('#datepicker').datepicker('option','beforeShowDay',function(date){ var ret = [(date.getDay() != 6 && date.getDay() != 7)]; return ['true', 'yasumi']; });
    

// jQuery('#Date').datepicker({
// beforeShowDay: function(date) {
// if (date.getDay() == 6) {
// // クラス名を設定
// return [true, 'class-store-closed', ''];
// jQuery('option').hide();
// jQuery('select').addClass('saturdey');

// }
// }
// });

// });

などを試して、曜日を選ぶとselectタグなどにクラス名を付与させ、クラス名が付与されている場合にoptionタグの一部をdisplay:noneなどで非表示にしようと思いましたがそもそもクラス名がselectタグやoptionタグに付与されません。付与されるのはカレンダー画面のセルになってしまいます。

お願いします、助けてください。

Answer 1

// 日曜日を非表示
jQuery(function(){ jQuery('#datepicker').datepicker(); jQuery('#datepicker').datepicker('option','beforeShowDay',function(date){ var ret = [(date.getDay() != 0 && date.getDay() != 7)]; return ret; });});

jQuery(function($){

jQuery(".hasDatepicker").datepicker().on("change", function(e) {//日付を選ぶたびに動かしたい
var fDate =jQuery('.hasDatepicker').datepicker('getDate');

if (fDate !== null) {
fDate instanceof Date;
var youbi = fDate.getDay();
alert(youbi);//試しにわかりやすくalertで取得できてるか確認
// ここからifで振り分けたり、色々やりたい処理を
if(youbi==6){
jQuery('.heijitu').hide();
jQuery('.doyou').show();
}else{

    jQuery('.heijitu').show();
    jQuery('.doyou').hide();
}

};
});
});

↑これに応じてｈｔｍｌで営業時間のフォームをクラス名で表示・非表示切り替えるようにしました