Jak usuwać i dodawać konkretne elementy na stronie za pomocą Jquery?

Question

Witam. Przygotowywuję witrynę internetową i utknąłem w niemalże finalnym punkcie. Jest to strona cukierni, klient wymaga, zaś ode mnie stworzenia formularza do zamówień ciast. Prezentuję się on następująco.

Po zaznaczeniu wybranych produktów powinien pojawić się input do wpisania ile sztuk lub kg danego produktu potrzebujemy. Taka koncepcja to mój pomysł, który zrealizowałem, ponieważ input owszem pojawia się, ale mam problem z jego usunięciem, gdy odznaczymy któryś z wcześniej zaznaczonych checkboxów. Podaje mój kod. Macie jakieś pomysły? A może moja koncepcja jest niepoprawna i znacie lepsze sposoby na taki formularz. Z góry dzięki za pomoc 

   $("input[name^='ciasta']").change(function(){
        var checked = $(this).prop('checked');
        var wartosc= $("input[name^='ciasta']:checked").map(function() {
        return this.value;
        }).get();
            if(checked){
                $.each(wartosc, function(index){
              $('.ilosci'+(index+1)).html('<input type="number" class="form-control"                           style="display:block">'+wartosc[index]);
                   }); 
            }
            else{
                alert('No wlasnie jak ugryźć panowie i panie ten else?')
        }
    });
    

HTML checboxa, kolejne różnią się tylko wartością atrybutu name (przez to są chwytane w jquery)

<div class="checkboxes  ">
            <input type="checkbox"
                   id="ciasta-sernik"
                   value="sernik"
                   name="ciasta[ciasta-sernik]">
            <label style="display: inline" for="ciasta-sernik">
                                    Sernik
                            </label>
</div>