如何在jquery datepicker中将类添加到选定日期

Question

我正在使用日期范围的jQuery日期选择器插件。我有两个日期字段来自和到字段。我想在日期字段中添加一个类，这样当我切换到'To'字段时，我可以看到选择的起始日期，并使用添加的新类别进行不同的样式设置。

如果在不同月份选择了从和到日期，我的工作正常。但如果两个日期都在同一个月，那么就没有课程，我找不到办法。

对于不同的月份，我使用了一个类ui-datepicker-days-cell-over。但是在同一个月的情况下没有上课。

我也尝试过OnSelect和beforeShowDay函数，但没有帮助。我正在使用带有Drupal的jQuery选择器。

以下是不同月份和同月的屏幕截图：

The snippet for what I have tried

$(function() {
  var day = new Date().getDate();
    $( "#from" ).datepicker({
      changeMonth: true,
      numberOfMonths: 2,
       onSelect: function(selectedDate, el) {
				// custom callback logic here
				console.log(el);
                 
			},
      beforeShowDay: function(date) {   
      console.log(date.getDate); 
      	if (date.getDate() == day) {
                return [true, "selected", ""]; // Here you set your css class
            } else {
                return [true, ""]
            }     
        // set all the dates to have reserved class for now 
        
    	},
     
      onClose: function( selectedDate ) {
        $( "#to" ).datepicker( "option", "minDate", selectedDate );
      }
    });
    $( "#to" ).datepicker({
      defaultDate: "+1d",
      changeMonth: true,
      numberOfMonths: 2,
      onClose: function( selectedDate ) {
        $( "#from" ).datepicker( "option", "maxDate", selectedDate );
      }
    });
  });

.ui-datepicker-current-day  { color:white;background:red;)
    .ui-datepicker-days-cell-over{background-color: #e0001b!important;color:#fff;}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script>

  
  <link rel="stylesheet" href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">
  <script src="//code.jquery.com/jquery-1.10.2.js"></script>
  <script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
  <link rel="stylesheet" href="/resources/demos/style.css">
<label for="from">From</label>
<input type="text" id="from" name="from">
<label for="to">to</label>
<input type="text" id="to" name="to">