JSFiddle - React, Tailwind, and code Playground
HTML
<div class="buttons">
<input type="button" id="add" value="add" /> <input type="button" id="remove" value="remove" />
</div>
<div class="content">
<div class="inner"><a href="#" class="rem">remove this inner</a></div>
</div>
CSS
.buttons{
width:95%; height:35px; margin-bottom:20px; float:left;
}
.content{
width:90%; min-height:35px; max-height:100%; margin-bottom:10px; background-color:#F96; float:left;
}
.inner{
width:97%; height:35px; margin-bottom:10px; background-color:#CCC;
margin:10px; float:left;
}
JavaScript
$(".inner").eq(1).css("background-color","#0C9");
$(".inner").eq(2).css("background-color","#F00");
$(".inner").eq(3).css("background-color","#990");
$("#add").click(function(){
$(".content").append("<div class='inner'><a href='#' class='rem'>remove this inner</a></div>");
});
$(document).on("click","a.rem",function(e){
e.preventDefault();
var num = $("a.rem").index(this);
$(this).closest('.inner').remove();
});