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 class="inner"><a href="#" class="rem">remove this inner</a></div>

<div class="inner"><a href="#" class="rem">remove this inner</a></div>

<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>");	
	});
	
	$('.content').on('click', 'a.rem', function(e){
  e.preventDefault();
  $(this).closest('.inner').remove();
});