JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.11.4/jquery-ui.css">
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.1/i18n/jquery-ui-i18n.min.js"></script>
Arrive:
<input type="text" id="arrivalDate" class="datepicker">
<br />Nights:
<input type="text" id="numOfNights" value="1">
<br />Depart:
<input type="text" id="departureDate">

JavaScript

$.datepicker.setDefaults($.datepicker.regional["id"]);
$('#arrivalDate').datepicker({
        
        dateFormat: "d/MM/yy",
       
        onSelect: function (dateStr) {
            var nights = parseInt($('#numOfNights').val());
            var depart = $.datepicker.parseDate('d/MM/yy', dateStr);
            depart.setDate(depart.getDate() + nights);
            $('#departureDate').val($.datepicker.formatDate('d/MM/yy', depart));
        }
    });

    $('#numOfNights').change(function () {
        var nights = parseInt($('#numOfNights').val());
        var depart = $.datepicker.parseDate('d/MM/yy',        $('#arrivalDate').val());
        depart.setDate(depart.getDate() + nights); 
         $('#departureDate').val($.datepicker.formatDate('d/MM/yy', depart));
    });
$(function() {
		$( "#departureDate" ).datepicker({dateFormat: "d/MM/yy"});
    });