去掉 <div> 使用jQuery

Question

I have this HTML code:

<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>

Now I would like to use jQuery to delete a <div> element AFTER the 'X' clicking, is it possible?

First X closes:

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

etc etc. Can I remove a div without using id="" ?

Thank you!

Answer 1

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

or instead of remove() you could use slideUp()

Answer 2

Yes, use jQuery's traversal methods to find the correct element. In this case, you just need parent() :

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

Answer 3

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

u can check here http://jsfiddle.net/3JCR7/1/