JQuery删除父节点

我想添加一个应用程序，用户可以添加任意多的字段集。当用户单击“添加”时，它会添加第二个带有package2的文件集。如果用户单击相应的“删除”，它将删除相应的字段集。应用程序应始终至少有一个字段集，这意味着如果web上只有一个字段集，则无法删除该字段集。我已经完成了这里的一些代码，有人能帮我找出它的错误吗？非常感谢。

HTML代码：

<form>  
    <div id="fieldwrapper">
      <fieldset class="col-md-9 col-md-offset-1 bottom20" id="addField">
        <div class="col-md-11">

            <label class="col-md-1 label-right left-0">package1*</label>
            <div class=" col-md-11 input-div " id="tracking">
                <input type="text" class="col-md-11 input-div form-control required" >
            </div>
            <div id="errors" class="txt-left"></div>


            <label class="col-md-1 label-right">comment</label>
            <div class="col-md-11 input-div">
                <input class="form-control" type="text" >      
            </div>

        </div>

        <div class="col-md-1">
          <button type="button" class="btn btn-danger remove top25" >delete</button>
        </div>

      </fieldset>
    </div>




    <div class="form-group col-md-9 col-md-offset-1">
      <div class="col-md-6">
        <input type="button" class="btn btn-success btn-block" id="add" value="add" >
      </div>

      <div class="col-md-6">
        <button class="btn btn-primary btn-block" type="submit">finish</button>
      </div>
    </div>

</form>

包装1*
评论
删除
完成

JS代码：

$(document).ready(function(){


   // $('.remove').click(function(){
   //      $(this).parents("fieldset").remove();
   //  });

    $("#add").click(function() {    
      $('.remove').click(function(){
        $(this).parents("fieldset").remove();
      });    
         var intId = $("#fieldwrapper fieldset").length + 1;
        var html = '<fieldset class="col-md-9 col-md-offset-1 bottom20" id="addField" >';
        html += '<div class="col-md-11" >';
        html += '<label class="col-md-1 label-right left-0">package' + intId + '*</label>';
        html += '<div class=" col-md-11 input-div" id="tracking">';
        html += '<input type="text" class="col-md-11 input-div form-control required" >';
        html += '</div>';
        html += '<div id="errors" class="txt-left"></div>';
        html += '<label class="col-md-1 label-right">comment</label>';
        html += '<div class="col-md-11 input-div">';
        html += '<input class="form-control" type="text" >';
        html += '</div></div>';

        html += '<div class="col-md-1">';
        html += '<button type="button" class="btn btn-danger remove top25" >delete</button>';
        html += '</div>';
        html += '</fieldset>';


        $("#fieldwrapper").append(html);
    });
});

$（文档）.ready（函数（）{
//$（'.remove'）。单击（函数（）{
//$（this.parents（“fieldset”）.remove（）；
//  });
$（“#添加”）。单击（函数（）{
$（'.remove'）。单击（函数（）{
$（this.parents（“fieldset”）.remove（）；
});    
var intId=$（“#fieldwrapper fieldset”）.length+1；
var html=''；
html+=''；
html+='package'+intId+'*'；
html+=''；
html+=''；
html+=''；
html+=''；
html+=‘注释’；
html+=''；
html+=''；
html+=''；
html+=''；
html+=“删除”；
html+=''；
html+=''；
$（“#fieldwrapper”）.append（html）；
});
});

问题在于，在处理动态创建的元素上的事件时，需要使用事件委派

工作演示

---

问题在于，在处理动态创建的元素上的事件时，需要使用事件委派

工作演示

---

您会遇到什么类型的错误？在fiddle中，jquery不包括在内，但这不是主要问题。在1秒内发布答案你会得到什么类型的错误？在fiddle中，jquery不包括在内，但这不是主要问题。发布一个答案，在1节！你真棒！谢谢你真棒！

$(document).on("click", ".remove", function(){
  if ($("fieldset", "#fieldwrapper").length > 1) {
    $(this).closest("fieldset").remove();
  }
});