JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css">
<div id="4ed6fea2f11aac0d6300002d" class="blog_calendar"></div>

CSS

table.ui-datepicker-calendar tbody td.highlight > a {
    background: url("images/ui-bg_inset-hard_55_ffeb80_1x100.png") repeat-x scroll 50% bottom #FFEB80;
    color: #363636;
    border: 1px solid #FFDE2E;
}

JavaScript

$(document).ready(function() {
  var dp, events;
  events = [];
  return dp = $(".blog_calendar").datepicker({
    beforeShowDay: function(date) {
      var matching, result;
      $.getJSON("https://raw.github.com/gist/1676157/15ce81851e57dfcecb985039e970a749585959de/my.json", function(data) {
        return events = data;
      });
      result = [true, "", null];
      matching = $.grep(events, function(event) {
        return event.Date.valueOf() === date.valueOf();
      });
      if (matching.length) {
        result = [true, "highlight", null];
      }
      return result;
    },
    onSelect: function(dateText) {
      var date, event, i, selectedDate;
      date = void 0;
      selectedDate = new Date(dateText);
      i = 0;
      event = null;
      while (i < events.length && !event) {
        date = events[i].Date;
        if (selectedDate.valueOf() === date.valueOf()) {
          event = events[i];
        }
        i++;
      }
      if (event) {
        return alert(event.Title);
      }
    }
  });
});