Remove div "Clone" in jquery

Question

I have a div that can be cloned in jquery, I need to click "Close div" remove the cloned div when clicked...

Follows the code..

$(document).ready(function() {
    var linha = $(".engloba:first").clone();
    $("#mais").click(function() {
        $("#conteudo_engloba").append(linha.clone());
    });
 });

<script type="text/javascript" src="http://code.jquery.com/jquery-1.11.2.min.js"></script>
<form>
    <input type="button" name="" value="CLONAR" id="mais">
</form>

<div id="conteudo_engloba">
	<div class="engloba">
		<p>Fechar DIV</p>
		<h1>Conteudo</h1>
		
	</div>
</div>

Answer 1

Just click to delete the last cloned element. I think that’s what you want, I added a class (fechar) at the <p>Fechar DIV</p>:

$(document).ready(function() {
    var linha = $(".engloba:first").clone();
    $("#mais").click(function() {
       $("#conteudo_engloba").append(linha.clone());
    });
    $("#conteudo_engloba").on('click', '.fechar', function() {
       $(this).parent().remove();
    });
 });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.11.2.min.js"></script>
<form>
    <input type="button" name="" value="CLONAR" id="mais">
</form>

<div id="conteudo_engloba">
	<div class="engloba">
		<p class="fechar">Fechar DIV</p>
		<h1>Conteudo</h1>
		
	</div>
</div>