尝试删除HTML元素的父级

Question

我正在尝试使用JQuery删除HTML元素的父级。 click事件涉及span元素，我当时正在尝试删除整个<tr>元素。

这是DOM树：

{% for element in elements %}
 <tr>
  <th scope=row>Kate</th>
    <td><span id="update">Update</span></td>
    <td id="delete">Delete</td>              
  </tr>
{% endfor %}

这是尝试删除td> span的父元素的JQuery代码。

$('body').on('click','#delete',function(){
   var td = $(this).parent();
   $(td).parent().fadeOut('slow');
});

此代码对我永远都行不通，所以请任何人提供帮助。

Answer 1

首先，不要为delete按钮分配id

{% for element in elements %}
 <tr>
  <th scope=row>Kate</th>
    <td><span id="update">Update</span></td>
    <td class="delete">Delete</td>              
  </tr>
{% endfor %}

现在将click事件处理程序分配给delete类

$('body').on('click','.delete',function(){
   $(this).parent().parent().fadeOut('slow', function(){
     $( this ).remove();
   });
});

Answer 2

您可以使用：

$(".your_child_element").unwrap()