Как удалить последний динамически сгенерированный div в jquery

Question

Это мое html div # поле генерируется динамически при нажатии кнопки. При нажатии необходимо удалить последнее поле div.

html

<div class="col-12" id="buildyourform" style="height: 150px; overflow: auto;">
<div class="fieldwrapper input-group input-group-sm mb-3 overflow-auto" id="field1">
<input type="number" class="fieldname col-6 form-control" id="af1">
<input type="number" class="fieldtype col-4 form-control" id="sp1">1</div>
<div class="fieldwrapper input-group input-group-sm mb-3 overflow-auto" id="field2">
<input type="number" class="fieldname col-6 form-control" id="af2">
<input type="number" class="fieldtype col-4 form-control" id="sp2">2</div>
<div class="fieldwrapper input-group input-group-sm mb-3 overflow-auto" id="field3">
<input type="number" class="fieldname col-6 form-control" id="af3">
<input type="number" class="fieldtype col-4 form-control" id="sp3">3</div>
</div>

jquery

$('#addairdata').on('click', function (event) {
    event.stopPropagation();
    event.preventDefault(); 
    var lastField = $("#buildyourform div:last");
    var intId = (lastField && lastField.length && lastField.data("idx") + 1) || 1;
    // console.log(intId);
    var fieldWrapper = $("<div class=\"fieldwrapper input-group input-group-sm mb-3 overflow-auto\" id=\"field" + intId + "\"/>");
    fieldWrapper.data("idx", intId);
    var fName = $("<input type=\"number\" class=\"fieldname col-6 form-control\" id=\"af" + intId + "\"/>");
    var fType = $("<input type=\"number\" class=\"fieldtype col-4 form-control\" id=\"sp" + intId + "\" />");

    // var fType = $("<select class=\"fieldtype\"><option value=\"checkbox\">Checked</option><option value=\"textbox\">Text</option><option value=\"textarea\">Paragraph</option></select>");
    // var removeButton = $("<button type=\"button\" class=\"col-2 btn btn-sm btn-outline-primary float-right\" disabled>"+intId+"</button>");
    // removeButton.click(function() {
    //     $(this).parent().remove();
    // });
    // console.log(intId);

    console.log(intId);


    var removeButton = $(".remove")

    removeButton.click(function() {

        console.log(intId-intId);
        // $("#buildyourform div:last-child").remove()
        // $("#field"+intId).remove();   
        // $("#field"+intId).remove();
    });
    fieldWrapper.append(fName);
    fieldWrapper.append(fType);
    fieldWrapper.append(intId);
    $("#buildyourform").append(fieldWrapper);

})

, когда когда-либо генерируется div несколько раз при Нажмите кнопку «Удалить». Он должен удалить последний элемент div, и после этого при добавлении нового элемента div должен быть идентификатор последовательного элемента div в данный момент

Answer 1

Создать стек или массив строк с идентификатором динамического элемента c Элемент, записать метод для удаленного последнего элемента, использовать стек или массив, который содержит идентификаторы элемента динамического c, для получения идентификатора недавно добавленного элемента, затем нажмите удалить элемент по идентификатору, как это

function removeElement(id) {
    var elem = document.getElementById(id);
    return elem.parentNode.removeChild(elem);
}