Ajax成功后删除div

Question

I have a simple script that should delete a div after the ajax call is success:

$ ->
 $('body').on 'click', '.add-comment', (event) ->
   event.preventDefault()
   body = $('#body_comment')
   target = event.target

   $.ajax
    method: 'POST'
    url: '/comments/create'
    data:
     body: body
   success: (data) ->
    target.remove()
   error: (data) ->
    # nothing here

If I do:

console.log(target)

In the success block, it show the correct html div, but nothing happens when I do target.remove() or target.hide()

Where I wrong ?

PS: I've tried also to use $(target).remove() , without success.. new code:

 $('body').on 'click', '.add-comment', (event) ->
   event.preventDefault()
   body = $('#body_comment')
   target = event.target

   $.ajax
    method: 'POST'
    url: '/comments/create'
    data:
     body: body
   success: (data) ->
    $(target).remove()
   error: (data) ->
    # nothing here

PPS: OK I've found that was a conflict with another mine script...sorry guys!

Answer 1

It should be

$(target).remove();

event.target is DOMElement. In order to use jQuery methods, you should convert it to jQuery instance, but wrapping it into $ function.