JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<div style="margin: 10px 10px 10px 0px" id="addNewDiv"> <table style="width: 100%" id="maintable" class="cloneTable">
    <tr><td><input type="text" name="text" id="text"/></td></tr>
  </table></div>
<input type="button" value="Add New Div" onclick="addNewDiv();"	style="background-color: #3E8DE1; color: white;" />

JavaScript

var count=1;

function addNewDiv(){
    var $clone = $(".cloneTable:first").clone(true);
		$clone.find(':text,:file').each(function() {
	    	$(this).attr('id',($(this).attr("id")+count));
	    	$(this).val('');
	    });
		 $clone.find("a").each(function() {
	       	  $(this).val('').attr('id', function(_, id) {
	       	    return count;
	       	  });
	       	});
		 $clone.find("span").each(function() {
        	 $(this).attr({
         		id: $(this).attr("id") + count
         });
        });
		
		
              $clone.attr( 'id', function() { 
            	 
            	  return this.id + count; })
		
		 .appendTo('#addNewDiv');
    count=count+1;
  }