使用jQuery移除<div>元素

Question

我有这段 HTML 代码：

<div id="note_list">
  <div class="note">
    Text 1
    <a href="">X</a>
  </div>
  <div class="note">
    Text 2  
    <a href="">X</a>
  </div>
  <div class="note">
    Text 3  
    <a href="">X</a>
  </div>
  <div class="note">
    Text 4  
    <a href="">X</a>
  </div>
  <div class="note">
    Text 5  
    <a href="">X</a>
  </div>  
</div>

现在我想使用jQuery在'X'被点击后删除一个<div>元素，是否可能？

首先关闭'X':

  <div class="note">
    Text 1
    <a href="">X</a>
  </div>

我能否在不使用id=""的情况下删除一个div？

谢谢！

- Dail

---

可以的....请看DOM遍历方法：http://api.jquery.com/category/traversing/tree-traversal/ - Felix Kling

Answer 1

$(".note a").click(function(e) {
    e.preventDefault();
    $(this).parent().remove();
});

你可以使用slideUp()代替remove()

- Manuel van Rijn

Answer 2

是的，使用jQuery的遍历方法来找到正确的元素。在这种情况下，你只需要使用parent()：

$('div.note a').click(function(event) {
    event.preventDefault();
    $(this).parent().remove();
});

- lonesomeday

Answer 3

$(".note a").click(function() {
    $(this).parent().remove();
});

你可以在这里查看 http://jsfiddle.net/3JCR7/1/

- Sedat Başar