JQuery hinzufügen und mehr divs mit einem Klick

Question

hier entfernen, ist der Code:

$('.add').click(function() { 

var description = $('#description').val(); 
$(".append_data").append('<div class="row" style="background: #e6e6e6; color: #666; border-bottom: solid 1px #fff;"><div class="col-md-3"><input type="text" name="1"></div><div class="col-md-5"><input type="text" name="2"></div><div class="col-md-2"><input type="text" name="3"></div><div class="col-md-2"><input type="text" name="4"></div></div><div class="remove">Remove</div>'); 

}); 

$('.append_data').on('click', '.remove', function(e) { 
    //alert('boom'); 
    e.preventDefault(); 
    $(this).closest('.row').remove(); 
    return false; 
}); 

Hier ist der Fiddle Code: https://jsfiddle.net/L7su5ke7/

Es mehrere divs fügt hinzu, alles in Ordnung. Aber wie kann ich diese mit einem Klick löschen - leider! Ich habe nicht herausgefunden (( Ich habe versucht, "am nächsten" und "Eltern" beide ohne Glück

Answer 1

Was ich getan habe ist, dass ich diesen HTML-Code eingeschlossen, die Sie dynamisch mit einem anderen <div>

$('.add').click(function() { 

var description = $('#description').val(); 
$(".append_data").append('<div><div class="row" style="background: #e6e6e6; color: #666; border-bottom: solid 1px #fff;"><div class="col-md-3"><input type="text" name="1"></div><div class="col-md-5"><input type="text" name="2"></div><div class="col-md-2"><input type="text" name="3"></div><div class="col-md-2"><input type="text" name="4"></div></div><div class="remove">Remove</div></div>'); 

}); 

$('.append_data').on('click', '.remove', function(e) { 
    e.preventDefault(); 
    $(this).parent().remove(); 
}); 

Dann fügen Sie einfach den Eltern entfernt, wenn die Schaltfläche Entfernen geklickt wird!

-Link: jsfiddle link

Answer 2

versuchen Sie dies:

$('.append_data').on('click', '.remove', function(e) { 
    $(this).parent().find('.row').each(function(){ 
    $(this).remove(); 
    }); 
    return false; 
}); 

Answer 3

https://jsfiddle.net/1z40zrqt/2/

$('.append_data').on('click', '.remove', function(e) { 

    e.preventDefault(); 

    $(this).parent().empty(); 
    return false; 
}); 

Answer 4

Wie wäre es

$('.append_data').on('click', '.remove', function(e) { 
    //alert('boom'); 
    $('.row').remove(); 
    $('.remove').remove(); 

    return false; 
});