JSFiddle - React, Tailwind, and code Playground

by letterpress

HTML

<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.15/jquery-ui.js"></script>
<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.15/themes/ui-lightness/jquery-ui.css">
<ul>
<li id="shipmentCtl" class="active">
  <div class="filter"><h5>Click to edit date</h5></div>
</li>
<ul>
<div id="qv"><div id="dpDate" type="text"></div></div>

JavaScript

$("#shipmentCtl").find(".filter").click(function(){
    $("#dpDate").datepicker({
        create : $("#qv").dialog(),
        onSelect : function(dateText){
            d = $.datepicker.parseDate("mm/dd/yy",dateText);
            d = $.datepicker.formatDate("yy-mm-dd",d);
            selected(d);
            $(this).datepicker("destroy");
            $("#qv").dialog("destroy").empty();
        }
    });
});

function selected(dateTime){
   alert('datepicker select event fired for '+d);
}