Add New Div with Event Handlers

HTML

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jquery-timepicker/1.10.0/jquery.timepicker.min.css">
<script src="https://code.jquery.com/jquery-2.2.4.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-timepicker/1.10.0/jquery.timepicker.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.17.0/moment.min.js"></script>
<h3>
  Date Picker Test
  <a href="#" id="do_addEvent" class="btn btn-warning pull-right">
    Add Event
  </a>
</h3>
<hr/>

<form>

  <div class="eventsDiv">

    <!-- Event[0] -->
    <div class="eventDiv" data-id="0">
      <div class="row">
        <div class="form-group col-xs-3">
          <label>Start Date</label>
          <input type="text" name="event[0].startDate" class="form-control startDate">

          <div class="checkbox">
            <label>
              <input type="checkbox" name="event[0].allDayEvent" class="allDayEvent" /> 
              All Day Event
            </label>
          </div>
        </div>

        <div class="form-group col-xs-3 timeDiv">
          <label>Start Time</label>
          <input type="text" name="event[0].startTime" class="form-control startTime">
        </div>
        <div class="form-group col-xs-3">
          <label>End Date</label>
          <input type="text" name="event[0].endDate" class="form-control endDate">
        </div>

        <div class="form-group col-xs-3 timeDiv">
          <label>End Time</label>
          <input type="text" name="event[0].endTime" class="form-control endTime">
        </div>
      </div>
      <hr/>
   ...

CSS

.fieldError {
  color: red;
}

JavaScript

// ***** START dateTimeRangeWidget.min.js *****
var dateTimeRangeWidget=function(a){function k(k){i=a.extend({},j,k),null!=i.$startDateElem&&null!=i.$startDateElem||(f=!1,console.log("Warning: date range is null.")),null!=i.$startTimeElem&&null!=i.$startTimeElem||(g=!1,console.log("Warning: time range is null.")),null==i.$allDayEventElem&&(h=!1,console.log("Warning: no $allDayEventElem is null.")),f&&(i.$startDateElem.datepicker({inline:!0,dateFormat:"m/d/yy"}),i.$endDateElem.datepicker({inline:!0,dateFormat:"m/d/yy"})),g&&(i.$startTimeElem.timepicker({scrollDefault:"08:00",timeFormat:"g:i a"}),i.$endTimeElem.timepicker({scrollDefault:"08:00",timeFormat:"g:i a"})),o(),f&&(i.$startDateElem.on("change",function(c){var e,f;m(a(this),b)&&(e=moment(i.$startDateElem.val(),b).startOf("day"),d>=0?(f=e.clone().add(d,"days").startOf("day"),i.$endDateElem.val(f.format(b))):""==a.trim(i.$endDateElem.val())&&(f=e.clone().startOf("day"),i.$endDateElem.val(f.format(b))),e.isSameOrBefore(f,"days")&&i.$endDateElem.removeClass(i.errorClass),n(),o())}),i.$endDateElem.on("change",function(c){var d,e;m(a(this),b)&&(e=moment(i.$endDateElem.val(),b).startOf("day"),""!=a.trim(i.$startDateElem.val())&&(d=moment(i.$startDateElem.val(),b).startOf("day"),d.isAfter(e,"days")?i.$endDateElem.addClass(i.errorClass):i.$endDateElem.removeClass(i.errorClass)),n(),o())})),g&&(i.$startTimeElem.on("change",function(b){var d,f;m(a(this),c)&&(d=moment(i.$startTimeElem.val(),c),e>=0?(f=d.clone().add(e,"minutes"),i.$endTimeElem.val(f.format(c))):""==a.trim(i.$endTimeElem.val())&&(f=d.clone(),i.$endTimeElem.val(f.format(c))),n(),o())}),i.$endTimeElem.on("change",function(a){n(),o()})),h&&(i.$allDayEventElem.on("click",function(a){l(this)}),l(i.$allDayEventElem))}function l(b){a(b).is(":checked")?i.$timeElements.hide():i.$timeElements.show()}function m(a,b){var c=moment(a.val(),b,!0).isValid();return c?a.removeClass(i.errorClass):a.addClass(i.errorClass),c}function n(){var...