Apply the right behavior of two datepicker.js fields that act as range of dates

datepicker-range.js

jQuery(document).ready(function($) {
    $("#date-start").datepicker({
      	changeMonth: true,
      	changeYear: true,
      	dateFormat: 'dd/mm/yy',
      	altField: 'input[name="date-start"]',
      	altFormat: 'yymmdd',
      	minDate: new Date(),
	    maxDate: '+2y',
	    onSelect: function(date){
	    	// change dd/mm/yy to yy-mm-dd
	    	var date = date.split("/").reverse().join("-");

	    	// add a single day to the selected day
	        var selectedDate = new Date(date);
	        var msecsInADay = 86400000;
	        var endDate = new Date(selectedDate.getTime() + msecsInADay);

	       	// set minimum date of date-end after selected date of date-start
	        $("#date-end").datepicker( "option", "minDate", endDate );
	        $("#date-end").datepicker( "option", "maxDate", '+2y' );
	    }
    });

    $("#date-end").datepicker({
      	changeMonth: true,
      	changeYear: true,
      	dateFormat: 'dd/mm/yy',
      	altField: 'input[name="date-end"]',
      	altFormat: 'yymmdd'
    });

    // apply acf style to the datepicker
    $('body > #ui-datepicker-div').wrap('<div class="acf-ui-datepicker" />');
});