JSFiddle - React, Tailwind, and code Playground
HTML
<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/themes/base/jquery-ui.css">
<link rel="stylesheet" href="http://static.jquery.com/ui/css/demo-docs-theme/ui.theme.css">
<div class="demo">
<p>Date: <input type="text" id="datepicker"></p>
</div><!-- End demo -->
CSS
#datepicker{padding:3px;}
div.demo{border:1px solid #ff0000;padding:10px;}
JavaScript
var defaultIconURL = "http://jqueryui.com/demos/"+
"datepicker/images/calendar.gif";
var newIconURL = "http://www.downloadatoz.com/_imgbank/" + "1001/QuickMonth-Calendar.icon.gif";
//<img class="ui-datepicker-trigger" //src="http://jqueryui.com/demos/datepicker/images/calendar.gif" // .... />
$( "#datepicker" ).datepicker({
showOn: "button",
buttonImage:defaultIconURL,
buttonImageOnly: true
});
$('.demo').hover(function(){
$( "#datepicker" ).datepicker( "option", "buttonImage", newIconURL );
},function(){
$( "#datepicker" ).datepicker( "option", "buttonImage", defaultIconURL );
});