Как удалить динамически добавленные элементы управления в представлении

Question

Я добавляю элементы управления динамически в div ниже, когда вы нажимаете такую ​​кнопку:

                                <div class="column" id="addkey" style="width: 200px">

                                </div>
                                <div class="column" id="main1" style="width: 150px">

                                </div>
                                <div class="column" id="docmanindex" style="width: 150px">

                                </div>
                            </div>

function AddPrimaryClick () {

        var selectedprimarykey = $("#ddlprimarykey :selected").text();

        var one = chkkeyId + i;

        var two = radioId + i;

        var three = chkindxid + i;



        $('#addkey').append('<input type="checkbox"' + ' id = ' + one + '/> ' + selectedprimarykey + '<br />' + '<br />');

        $('#main1').append('<input type="radio" ' + ' id = ' + two + '/> ' + '<br />' + '<br />');

        $('#docmanindex').append('<input type="checkbox" ' + ' id = ' + three + '/> ' + '<br />' + '<br />');

        i = i + 1;



    };

Как удалить ли указанные выше элементы управления, которые проверяются при нажатии кнопки?

Answer 1

Вы можете l oop через все отмеченные флажки и отмеченные переключатели и удалить его с помощью функции jquery remove ()

$("input[type='checkbox']:checked, input[type='radio']:checked").each(function(){
    $(this).remove();
});

Answer 2

Сделать это можно так:

$("#button").on("click", function() {
	$("input:checked").remove();
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type="checkbox" />
<input type="checkbox" />
<input type="radio" name="test" />
<input type="radio" name="test" />
<button id="button">
  Remove
</button>