JQuery Remove problem

When I try to use $element.remove() it doesn't work because the element isn't inside the dom yet. I have tried to use $element.html("") but that does only remove the inner html. I would like to clear the whole object.

edit

an event that tells me when the element gets added to the dom would help, because then I could do the element.remove() on it.

edit 2

Ok, some more information about the problem. I got 2 sortable lists (not connected for mu开发者_Python百科ltiple reasons) and I have added functionlity to move elements between these two sortable lists. But direclty after I have added the element to the other list, IE moves it back to the original list.

So I thought that I copy the item to the other list (instead of moving it) and remove the old one. But because of the element being in the memory, the original list just adds it again.

That's why I thought that if I clear the element (turn it into "") then it doesn't mather if it gets added to the original list again, because it's just an empty string.

Maybe there is a better solution to this problem? Suggestions?

---

Hard to tell what you need, but are you looking for the .not() method? This will filter out (at the top level) any elements that match the selector or element you pass.

var str = '<div>a div</div>\
        <span>a span</span>\
        <p>a paragraph</p>';

var $obj = $( str );

// remove the span before appending
$obj.not( 'span' ).appendTo( 'body' );

---

EDIT:

From your comment below, it seems as though you wish to prevent the rendering of an element coming from the server. This is not possible with javascript. Javascript can only manipulate elements that have been parsed into DOM elements. This means that by the time your javascript has a chance to manipulate it, it has already been displayed.

Depending on your situation, if you can't take care of this on the server side, you could perhaps try setting the element's CSS to display:none. This would not keep it from getting parsed but it would prevent it from being drawn on the page.

---

Maybe you are confusing .remove() with .empty()?

Regarding IE being slow when adding things to the DOM, yes, what you are using is a useful technique to add speed up by add everything at once.

$box = $('#thebox').remove().empty();
$box.append(...);
$box.append(...);
$box.append(...);
...
$box.append(...);
$('#theparentofthebox').append($box);

In here, .remove() works more like detach the element from the DOM.

---

Ok, so what I did was to mark the item with attr("remove", "true") and have a script to go through my element when a new item was dropped and remove those who should be removed.. Not ideal solution, but it works.