JSFiddle - React, Tailwind, and code Playground
by Superman
HTML
<span id="datepicker"></span>
CSS
.ui-state-active { //1.add this
background: blue !important;
}
.ui-state-active .ui-state-default{ //2. add this
background: red !important;
}
JavaScript
var unavailableDates = ["28-1-2015","11-1-2015","15-1-2015"];
function unavailable(date) {
dmy = date.getDate() + "-" + (date.getMonth()+1) + "-" + date.getFullYear();
if ($.inArray(dmy, unavailableDates) < 0) {
return [true,"","Book Now"];
} else {
return [false,"ui-state-active","booked"]; //3. edit here like this..
}
}
$(function() {
$( "#datepicker" ).datepicker({
minDate: 0,
maxDate: "+3M +10D",
beforeShowDay: unavailable
});
});