JSFiddle - React, Tailwind, and code Playground

by Sethu raman

HTML

<input type="text" id="txtDate"/>

CSS

.Highlighted a{
	   background-color : Green !important;
	   background-image :none !important;
	   color: White !important;
	   font-weight:bold !important;
	   font-size: 12pt;
}

JavaScript

var SelectedDates = {};
	SelectedDates[new Date('26/01/2014')] = new Date('26/01/2014');
	SelectedDates[new Date('01/05/2014')] = new Date('01/05/2014');
	SelectedDates[new Date('14/04/2014')] = new Date('14/04/2014');
	 
	var SeletedText = {};
	SeletedText[new Date('26/01/2014')] = 'Holiday1';
	SeletedText[new Date('01/05/2014')] = 'Holiday2';
	SeletedText[new Date('14/04/2014')] = 'Holiday3';

$('#txtDate').datepicker({
	   beforeShowDay: function(date)
	   {
	      var Highlight = SelectedDates[date];
	      var HighlighText = SeletedText[date];
	      if (Highlight) {
	         return [true, "Highlighted", HighlighText];
	      }
	      else {
	         return [true, '', ''];
	      }
	   }
	});