JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.14.1/jquery-ui.min.js"></script>
<link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/themes/ui-lightness/jquery-ui.css">
Start Date: <input type="text" id="start_date_picker">
End Date: <input type="text" id="end_date_picker">

CSS

.ui-datepicker { 
			width: 12em;
 }

JavaScript

$(function() { 
			$("#start_date_picker")
			.datepicker({dateFormat: "MM dd, yy",
			altFormat: "yymmdd", altField: "#start_date_picker"});
			$("#end_date_picker")
			.datepicker({dateFormat: "MM dd, yy",
			altFormat: "yymmdd", altField: "#end_date_picker"});
		}); 

		$('#start_date_picker').on("change",function(){ 
			startDate = $(this).
			datepicker('getDate'); 
			$("#end_date_picker").
			datepicker("option", "minDate", startDate); 
        	console.log(startDate);
		}) 

		$('#end_date_picker').on("change",function(){ 
			endDate = $(this).
			datepicker('getDate'); 
			$("#start_date_picker").
			datepicker("option", "maxDate", endDate); 
        	console.log(endDate);

		})