JSFiddle - React, Tailwind, and code Playground
HTML
<body>
<div class="plus">+</div>
<button class="plus">
<div class="item">
<p>title</p>
</div>
</button>
<div class="item">
<p>Title</p>
</div>
<div class="item">
<p>Title</p>
</div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
</body>
CSS
button div.item {
background-color: skyblue;
width: 50px;
height: 50px;
border-radius: 100%;
float: left;
}
div.item {
width:300px; margin-right:5px; margin-left:5px; margin-bottom:10px; float: left;
padding:10px; background-color: #BBBBBB; border: 1px solid #ccc; border-radius:10px;
}
JavaScript
$(document).ready(function(){
$("button.plus").on("click",function(){
$("div:last").after("<div class=item><p>Hello</p></div>");
})
})