Javascript 在jquery中动态添加/删除输入

我正在尝试使用JavaScript动态添加和删除一些输入。我有一个id为nuevaPartida的按钮，当它被单击时，调用一个事件，该事件添加两个输入类型文本（producto[]和cantidad[]）和两个标签

添加此组（输入字段和标签）时没有任何问题，问题是当我尝试单击id为quitaPartida的按钮删除组时。它只删除最后添加的组，当我再次单击时，不会删除任何其他组，我的意思是，该操作只工作一次，我需要通过单击获得删除一个组

HTML

<div class="partidas">
    <div class="masDatos">
        <div class="form-group col-md-6 masProductos">
             {!!Form::label('Producto')!!}
             {!!Form::select('producto[]', $almacenes, null, ['class' => 'form-control select2', 'data-placeholder' => 'SELECCIONE UN PRODUCTO', 'style' => 'width: 100%', 'id'=>'sproducto0'])!!}
        </div>
        <div class="form-group col-md-6 masCantidad">
            {!!Form::label('Cantidad')!!}
            {!!Form::text('cantidad[]', null, ['class' => 'form-control', 'placeholder'=>'Ej. 5', 'data-inputmask'=>'"mask": "999"', 'data-mask', 'id' => 'cantidad'])!!}
        </div>
    </div>
</div>

{！！Form:：label（'Producto'）！！}
{！！Form:：select（'producto[]'，$almacenes，null，['class'=>'表单控件select2'，'data占位符'=>'选择非产品'，'style'=>'宽度：100%，'id'=>'sprProducto0']）
{！！Form:：label（'Cantidad'）！！}
{！！Form:：text（'cantidad[]'，null，['class'=>'表单控件'，'placeholder'=>'Ej.5'，'data inputmask'=>'“mask”：“999'，'data mask'，'id'=>'cantidad']）

变量模板=“”+
''+
“{！！Form:：label（'Producto'）！！}”+
“{！！Form:：select（'producto[]'，$almacenes，null，['class'=>'表单控件select2'，'data placeholder'=>'seleccioneun-producto'，'style'=>'宽度：100%，'id'=>'sproducto0']）！！”+
''+
''+
“{！！Form:：label（'Cantidad'）！！}”+
“{！！Form:：text（'cantidad[]'，null，['class'=>'表单控件'，'placeholder'=>'Ej.5'，'data inputmask'=>'“mask”：“999'，'data mask'，'id'=>'cantidad']）！！”+
''+
'';
$（'nuevaPartida'）。在（'click'，函数（e）{
//$（'.partidas'）.append（模板）；
e、 预防默认值（）；
$（'.partidas'）。之前（模板）；
});
$（文档）。在（'click'，'#quitaPartida'，函数（e）{
e、 预防默认值（）；
$（'.partidas'）.children（'.masDatos'）.remove（）；
});

现在，您正在将动态内容插入目标div（

.partidas

）之前。因此，您的注释行正确地完成了工作，因为您希望将内容附加到目标div。取消注释该行，删除错误的一行，问题就解决了

工作代码段（）：

var模板=“”+
''+
“福”+
''+
''+
“福”+
''+
'';
$（'#nuevaPartida'）。在（'click'，function（）上{
$（'.partidas'）.append（模板）；
});
$（文档）。在（'click'，'#quitaPartida'，函数（）上{
$（'.partidas'）.children（'.masDatos'）.remove（）；
//如果要删除最后添加的组：
//$（'.partidas'）.children（'.masDatos'）.last（）.remove（）；
});
.partidas{颜色：浅灰色；背景：灰色；}
.masDatos{margin top:20px；}

新党
基塔党
使用
.each（function（）{$（this）.remove（）；}）
在
$（'.partidas'）.children（'.masDatos'）
我刚刚在发布我的答案后看到了OP编辑，现在我想你在寻找与我们想象中不同的东西，你能更好地解释一下吗？“单击一个元素”是什么意思？你的确切意思是什么元素？顺便说一下，我注意到你的代码中使用了西班牙语单词。也许你想选中“它只删除最后添加的组，我需要通过单击删除一个组”。如果它不是最后一个组，如果它们不是所有组，那么您要删除的组是什么？抱歉，问题是删除操作只删除最后一个组一次，因此，当我再次单击删除时，它不再起作用。