jQuery on remove not working parent node fire empty()

Question

I use jQuery ajax. According to the answer I remove or add. But jQuery.on function not working.

Example:

<div id="selector">
    <span>Hello World</span>
</div>

$(document).ready(function(){
    $(document).on('remove','span',function(){
        alert(" first object object deleted");
    });

    setTimeout(function(){
        $('#selector').empty();
    },3000);
});

jsFiddle.net https://jsfiddle.net/1zuau1f6/5/

edit: my question is not understood. Question I am correcting..

---Update---

i find solution in jquery.ui framework

$.cleanData = ( function( orig ) {
    return function( elems ) {
        var events, elem, i;
        for ( i = 0; ( elem = elems[ i ] ) != null; i++ ) {
            try {

                // Only trigger remove when necessary to save time
                events = $._data( elem, "events" );
                if ( events && events.remove ) {
                    $( elem ).triggerHandler( "remove" );
                }

                // Http://bugs.jquery.com/ticket/8235
            } catch ( e ) {}
        }
        orig( elems );
    };
} )( $.cleanData );

There is no `remove` event, hence why it's not working. If you want to run a code block on the removal of a DOMElement you would need to call it manually. — Rory McCrossan, Mar 25 '15 at 12:34
i usually $('#selector').parent().empty(). But remove event not working... — Haydar C., Mar 25 '15 at 13:05

score 1 · Answer 1 · answered Mar 25 '15 at 12:43

1

give a try like this..

setTimeout(function(){
    $('#selector').trigger('remove').remove();       
},3000);

fiddle Demo

answered Mar 25 '15 at 12:43

Raja

600
6
15

Milind Anantwar · Accepted Answer · 2015-03-25T12:40:42.880

0

Two issues:

1) You have to include jquery UI library to use remove event.

2) event delegation does not work with remove. thus use:

$('div').on('remove',function(){
    alert(" first object object deleted");
});

Working Demo

edited Mar 25 '15 at 12:40

answered Mar 25 '15 at 12:35

Milind Anantwar

81,290
25
94
125

@AhbapAldirmaz: sorry.... i didn't get you.. – Milind Anantwar Mar 25 '15 at 13:01

score 0 · Answer 3 · answered Mar 25 '15 at 12:47

0

$(document).ready(function(){

  $(document).on('remove','div',function(){
    alert("Element was removed");
   });     
  setTimeout(function(){
    $('#selector').trigger('remove');
   },3000);
});

Demo

Hope this helps

answered Mar 25 '15 at 12:47

tech-gayan

1,373
1
10
25

score 0 · Answer 4 · answered Mar 25 '15 at 13:08

Also you can override jQuery.remove() function:

$(function(){
    var origRemove = $.fn.remove;

    $.fn.remove = function newRemove() {
        var jQ = this.trigger("remove");
        return origRemove.apply(jQ, arguments);
    };    

    $(document).on('remove','div',function(){
        alert("object gonna be deleted");
    });

    setTimeout(function(){
        $('#selector').remove();        
    },3000);
})

jQuery on remove not working parent node fire empty()

4 Answers4

Linked