JSFiddle - React, Tailwind, and code Playground

HTML

<link rel='stylesheet' id='flatpickr-style-css'  href='https://cdn.jsdelivr.net/npm/flatpickr/dist/flatpickr.min.css?ver=5.2.4' type='text/css' media='all' />
<script type='text/javascript' src='https://cdn.jsdelivr.net/npm/flatpickr?ver=5.2.4'></script>
<div id="meta_inner">
    <span id="here"></span>
    <span class="add">Add Group</span>
</div>

JavaScript

$(document).ready(function () {
    var count = 1;
    
    $(".add").click(function() {
       count = count + 1;
       $('#here').append('<p> Group Name <input type="text" name="groups['+count+'][post_title]" value="" /> -- Start Date : <input id="datetime_'+count+'" type="text" name="groups['+count+'][startdate]" value="" /><span class="remove">Remove Group</span><input type="hidden" name="groups['+count+'][object_id]" value="" /></p>' );
       return false;
     });
     
     $("#here").on('click', '.remove', function() {
          $(this).parent().remove();
     });
     
      var config =  {
                    enableTime: true,
                    dateFormat: "Y-m-d H:i",
                    minDate: "today",
                    maxDate: new Date().fp_incr(365)
      };
     
      $("#here").on('click', '[id *="datetime_"]', function() {
          $(this).flatpickr(config);
     });
    
});