jquery javascript添加/删除按钮

我有一个表单，动态地添加额外的inputfields。因此，当我单击“添加”按钮时，应该会出现一个新的inputfield，但现在有一个“添加”和“删除”按钮。当我现在单击新输入字段旁边的“添加”按钮时，应该会出现另一个新输入字段等。删除按钮也是如此。到目前为止，一切都很好。。。我的问题是，我不能在点击“添加”后创建一个新的输入字段

因此，我的代码如下所示：

<div id="fields">
   <button class="add">Add</button> 
   <div class="newField">
     <div class="check">
        <input type="radio" id="field_1" name="correct" required></input>
     </div>
     <input type="text" id="input_1" required></input>                  
   </div>           
</div>

最重要的是，javascript：

var InputsWrapper   = $("#fields");
var x = InputsWrapper.length; 
var FieldCount=1; 

$('.add').click(function(e){
FieldCount++; 
$(InputsWrapper).append('<div class="newField"><button class="remove">Remove</button><button class="add">Add</button><div class="check"><input type="radio" id="field_'+ FieldCount +'" name="correct"></div><input type="text" id="input_'+ FieldCount +'" /></div></div>');
x++;
return false;
});

$(document).on("click",".remove", function(e){ 
   if( x > 1 ) {
     $(this).parent('div').remove(); 
     x--; 
   }
  return false;
});

var-inputswraper=$（“#字段”）；
var x=输入振打器长度；
var FieldCount=1；
$（'.add'）。单击（函数（e）{
FieldCount++；
$（InputsWrapper）.append（'RemoveAdd'）；
x++；
返回false；
});
$（document）.on（“click”、“.remove”，函数（e）{
如果（x>1）{
$（this.parent（'div'）.remove（）；
x--；
}
返回false；
});

这是一个演示小提琴：

有人能帮我吗？

更换线路

$（'.add'）。单击（函数（e）{

与

$（文档）。在（“单击”、“.add”上，函数（e）{

原因是

click（）

函数将

函数（e）{}

绑定到

。添加
在调用
click（）
函数时存在的元素

on（）
方法的工作原理不同。在单击事件上，它还将搜索任何
。添加在引发单击事件时存在的项

更换管路

$（'.add'）。单击（函数（e）{

与

$（文档）。在（“单击”、“.add”上，函数（e）{

原因是
click（）
函数将
函数（e）{}
绑定到
。添加
在调用
click（）
函数时存在的元素

on（）
方法的工作原理不同。在单击事件上，它还将搜索任何
。添加在引发单击事件时存在的项

只需指出
InputsWrapper
已经是jQuery对象，因此没有理由再次将其包装在jQuery选择器中。从append调用中删除
$（）
。只需指出
InputsWrapper
已经是jQuery对象，因此没有理由再次将其包装在jQuery选择器中。删除
$（）
从追加调用。这太棒了！如果我只想在输入字段旁边显示“删除”按钮，而只有最后一个字段有“添加”按钮，该怎么办？我现在就寝。如果没有其他人，我明天会回答。太棒了！我真的很感激：-）修复程序在这里。我还删除了不必要的$（）正如r3wt所指出的。还可以进行其他改进。哇，太棒了！太棒了！非常感谢！：-）这太棒了！如果我只想在输入字段旁边显示“删除”按钮，而只有最后一个字段有“添加”按钮，该怎么办？我现在就寝了。如果没有其他人有，我明天会回答。太棒了！我真的很感激：-）修复程序就在这里。正如r3wt指出的，我还删除了不必要的$（）。还可以进行其他改进。哇，太好了！太好了！非常感谢！：-）
var InputsWrapper   = $("#fields");
var x = InputsWrapper.length; 
var FieldCount=1; 

$('.add').click(function(e){
FieldCount++; 
$(InputsWrapper).append('<div class="newField"><button class="remove">Remove</button><button class="add">Add</button><div class="check"><input type="radio" id="field_'+ FieldCount +'" name="correct"></div><input type="text" id="input_'+ FieldCount +'" /></div></div>');
x++;
return false;
});

$(document).on("click",".remove", function(e){ 
   if( x > 1 ) {
     $(this).parent('div').remove(); 
     x--; 
   }
  return false;
});