JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/ui-darkness/jquery-ui.css">
<div id="datepicker"></div>
<p>
  Dates:
  <input type="text" id="input1" size="10">
  <input type="text" id="input2" size="10">
</p>

CSS

.dp-highlight .ui-state-default {
  background: #484;
  color: #FFF;
}

JavaScript

/*
 * jQuery UI Datepicker: Using Datepicker to Select Date Range
 * http://salman-w.blogspot.com/2013/01/jquery-ui-datepicker-examples.html
 */
$(function() {
        $("#datePicker").datepicker({dateFormat: "mm-dd-yy"});
  $("#datepicker").datepicker({
    beforeShowDay: function(date) {
      var date1 = $.datepicker.parseDate($.datepicker._defaults.dateFormat, $("#input1").val());
      var date2 = $.datepicker.parseDate($.datepicker._defaults.dateFormat, $("#input2").val());
      return [true, date1 && ((date.getTime() == date1.getTime()) || (date2 && date >= date1 && date <= date2)) ? "dp-highlight" : ""];
    },
    onSelect: function(dateText, inst) {
      var date1 = $.datepicker.parseDate($.datepicker._defaults.dateFormat, $("#input1").val());
      var date2 = $.datepicker.parseDate($.datepicker._defaults.dateFormat, $("#input2").val());
      if (!date1 || date2) {
        $("#input1").val(dateText);
        $("#input2").val("");
        $(this).datepicker("option", "minDate", dateText);
      } else {
        $("#input2").val(dateText);
        $(this).datepicker("option", "minDate", null);
      }
    }
  });
    

});