Sprite as jQuery UI datepicker icon

Answer on SO.

HTML

<link rel="stylesheet" href="http://code.jquery.com/ui/1.8.18/themes/base/jquery-ui.css">
<label for="startdate">Date</label>
<input value="01/01/2016" id="startdate" class="date-picker" type="text">
<p>
<ul>
<li>Manually change date to 02/02/2001</li>
<li>Now click 'select date' and choose any date in the current month</li>
</ul>
</p>

CSS

.icon {
    display:inline-block;
    width:20px;
    height:20px;
    background:#00f;
    vertical-align:bottom;
}

JavaScript

$("#startdate").datepicker(
                {
                    changeMonth: true,
                    changeYear: true,
                    showOn: "button",
                    
                    buttonText: "Select date",
                    dateFormat: 'dd/mm/yy',
                    yearRange: "-10:+5"
                }
            );
    
    $(".icon").click(function(){
        $(".date-picker").focus();        
    });