JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="http://code.jquery.com/ui/1.8.20/themes/base/jquery-ui.css">
<div id="linkscontainer">
    <div id="newlink" class="linkbox">
        <div style="border:1px solid black;"> <span>Date:</span>
            <span><input type="text" name="newdate[]" value="" id="dates" class="date" /><span>
            
          
        <div>Remark:</div>
                
          
    <textarea name="linkdesc[]" size="1" id="Editbox19" style="width:550px;height:45px;z-index:2; color:black" autocomplete="off"></textarea>
               
        </span></span></div>   
        </div>
        </div>
    
    <input  type="button" id="addnew" name="linkdesc[]" value="Add More" style="width: 80px; height: 24px; z-index: 136; color: black;">

JavaScript

$(document).ready(function(){
    
    var container= $('#newlink').html(); // container to add
    var ids=1; //id numbers for add. datepickers
    
    $('#addnew').click(function() {
         $('#linkscontainer').append(container); // add container
        $('.date:last').attr('id', ids);// each datepicker must have a unique id. 
        ids++; // increase the id numbers
        
    });    
    



});

$(document).on('focus',".date", function(){ //bind to all instances of class "date". 
    $(this).datepicker();
});