JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script>
<div>
<div id="first">
  <span>Tanggal Awal : <span id="tgl_awal"></span></span>
</div>
<div id="second" style="margin-top: 10px;">
  <span>Tanggal Akhir : <span id="tgl_akhir"></span></span>
</div>
<div id="diff" style="margin-top: 10px;">
  Jangka Waktu : <span id="jw"></span>
</div>
</div>

JavaScript

var mD = {
	first: '',
	scnd: '',
  init: function(){
  	this.setFirst();
  	this.setSecond();
  },
	setFirst: function(){
  	var _this = this;
  	$("#first").datepicker({
      onSelect: function(){
        _this.first = $(this).val();
        $("#tgl_awal").html(_this.first)
        _this.calcDiff();
      }
    });
  },
  setSecond: function(){
  	var _this = this;
    $("#second").datepicker({
    	onSelect: function(){
      	_this.scnd = $(this).val();
        $("#tgl_akhir").html(_this.scnd);
        _this.calcDiff();
    	}
    });
  },
  calcDiff: function(){
    var date1 = new Date(this.first);
    var date2 = new Date(this.scnd);
    var timeDiff = Math.abs(date2.getTime() - date1.getTime());
    var diffDays = Math.ceil(timeDiff / (1000 * 3600 * 24));
    if(date1 > date2){
	    $("#jw").html("TANGGAL AWAL TIDAK BOLEH LEBIH BESAR DARI TANGGAL AKHIR");
    } else {
	    $("#jw").html(diffDays);
    }
  }
}

mD.init();