JSFiddle - React, Tailwind, and code Playground

HTML

<div>
<input type="text" id="inpText"> 
<textarea rows="12" cols="50">   //it is text area which also goes down
TextArea Location    
</textarea>
<input type="button" id="addBut" value="Add"> // HTML tag of Button which goes down
<input type="button" id="TextBut">
</div>

CSS

#addBut{     //style of button which goes down
display: block; padding: 3px 10px; cursor: pointer; margin: auto;
}

.content{       //style of div which is to be prepend
position:relative;
background-color: white;
width: 500px;
height:350px;
padding: 25px;
border: 5px solid black;
 display:block;
margin-left:auto; 
margin-right:auto;
top:200px; 
}

JavaScript

$(document).ready(function(){
var count=0;
$("#addBut").click(function(){


$('body').append('<div class="content"  id="first'+count+'"><h3>Heading tag</h3><p>Paragraph tag</p></div>'); 
//It is the jquery code div which I prepends
count++;

});

$( "#TextBut" )
.click(function() {
var value = $( inpText ).val();
$( "#para" ).text( value );
})
});