JSFiddle - React, Tailwind, and code Playground
HTML
<script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.4/jquery-ui.min.js"></script>
<link rel="stylesheet" href="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.4/themes/smoothness/jquery-ui.css">
<div class="container">
<input type="text" />
<div class="toggleContainer">
<div class="myDatepicker"></div>
</div>
</div>
JavaScript
$(document).ready(
init
);
function init() {
$('.myDatepicker').datepicker();
$(document).on('click', '.myToggleInput', function(e) {
$('.toggleContainer').show();
});
$('.toggleContainer').on('click', function(e) {
e.stopPropagation();
});
$(document).on('click', function(e) {
$('.toggleContainer').hide();
});
};