jquery datepicker 元素不响应任何修改 DOM 的 js

Question

我正在尝试在 jquery ui datepicker 中获取日期单元格，以便在单击它们时突出显示我想要的颜色，但无论我做什么，元素似乎都没有改变。

<style>
  .mydatepicker-selected {
    background-color: red!important;
  }
</style>
<script>
  var selecteddates = [];

  function highlight() {
    $.each($('td'), function() {
      console.log($(this).html());
      $(this).remove();

    });
  });
  }
  $(document).ready(function() {
    $('#mydatepicker').datepicker({
      onSelect: function(datetext, obj) {
        var dateindex = $.inArray(datetext, selecteddates);
        if (dateindex == -1)
          selecteddates.push(datetext);
        else
          selecteddates.splice(dateindex, 1);
        highlight();
      }
    });
  });
</script>
<div id='mydatepicker'></div>
<table>
  <tr>
    <td>test</td>
  </tr>
</table>

页面底部带有“test”文本的 td 被删除，但日期选择器中的 td 都没有。 console.log 显示我确实选择了日期选择器中的所有 td，但删除功能无效。我也尝试过不那么激烈的方法，比如添加/删除类，但没有一个效果。有任何想法吗？最终我只想在某些 tds 上添加和删除类以突出显示日期单元格。

Answer 1

我认为您只需要以下样式：

.ui-datepicker-calendar .ui-state-active {
   background-color: red!important;
 }