Javascript Jquery日历弹出式颜色更改

我正在使用jquery创建日期选择器。我在更改弹出日历的颜色时遇到问题。 我的代码是：

 $(function() {
    $( "#checkin" ).datepicker({minDate : 0, dateFormat: 'dd-mm-yy'});
    $("#checkin").addClass("my-class");
    $("#checkout").attr("disabled", "disabled");
    $( "#checkout" ).datepicker({minDate:0, dateFormat: 'dd-mm-yy'});

    $( "#checkin" ).on("change",function(){
        onCheckin();

    });

});

function onCheckin(){
    if($("#checkin").val() !== ""){
        $("#checkout").removeAttr("disabled");
        var dateMin = $('#checkin').datepicker("getDate");
        var rMin = new Date(dateMin.getFullYear(), dateMin.getMonth(), dateMin.getDate() + 1);
        $("#checkout").datepicker('option', 'minDate', new Date(rMin));
    }else{
        $("#checkout").val("");
        $("#checkout").attr("disabled", "disabled");
    }
}

html是：

<div class='row'>
    <div class='col-4'>
    <p>Checkin: <input type='text' id='checkin' ></p><br>
    </div>
    <div class='col-4'>
    <p>Checkout: <input type='text' id='checkout'>
    </div>
</div>

---

它会改变文本区域的颜色，但每当日历弹出时，我都希望提供刚性背景。我是web开发新手。非常感谢任何帮助。

日历弹出窗口持有类

ui日期选择器

。因此，请尝试使用以下css：

.ui-datepicker {
  background-color: #FF0F0F !important;
 }

或：

你们班是：

.my-class{
  background-color: #FF0F0F !important;
 }

工作片段

$（'#date'）.datepicker（）；
$（'.ui datepicker'）.addClass（'my-class'）
。我的班级{
背景色：#FF0F0F！重要；
}
我需要将（.ui datepicker）类添加到我的输入元素中？很高兴提供帮助。请验证答案以备将来使用。快乐编码：）
$('.ui-datepicker').addClass('my-class');

.my-class{
  background-color: #FF0F0F !important;
 }