JSFiddle - React, Tailwind, and code Playground
HTML
<span class="btn" data-add-item>Add item</span>
<div class="container">
<div class="item">Hi there</div>
</div>
CSS
.container {
padding: 20px;
}
.item {
border: solid 1px #efefef;
padding: 5px 10px;
}
.btn {
display: inline-block;
background: #4c28ff;
padding: 10px 20px;
border-radius: 4px;
color: #fff;
}
JavaScript
var $container = $('.container').on('DOMNodeInserted', function (e) {
if ($(e.target).is('.item')) {
alert('added!');
}
});
$('[data-add-item]').on('click', function () {
$container.find('.item:first').clone().appendTo($container);
});