Remove div "Clone" in jquery

Question

Remove div "Clone" in jquery

Navigation

#1 by (2 votes)

1

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

Follow 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><inputtype="button" name="" value="CLONAR" id="mais">
</form>

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

javascript jquery

asked by anonymous 10.11.2016 / 18:29

1 answer

Forward and back button Return value 'undefined' because of asynchronism

score 2 · Accepted Answer

Just click delete the last cloned element. I think that's what you want, I've added a class ( fechar ) to <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><scripttype="text/javascript" src="http://code.jquery.com/jquery-1.11.2.min.js"></script><form><inputtype="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>