Dialog leaves the dom messy

Dialog leaves the dom messy


I noticed that even when I do the code below and I open and close my
dialog, I still have a bunch of divs sitting around in my dom. Of
course they are hidden but it seems weird that destroying and removing
doesn't get rid of these.
var myDialog = $j("<div id=\"myDialog-container\"></div>").load("/
myapp/dialogcontent.jsp");
myDialog.dialog({
close: function(e, ui) {
$j(this).remove();
}
});
I'm also very new to jQuery (spent years with Prototype) so any
suggestions are more then welcome on how I can improve my code. To
get rid of those extra div's I did the following code, but I'm not
sure if this is the correct way. What do you think?
var myDialog = $j("<div id=\"myDialog-container\"></div>").load("/
myapp/dialogcontent.jsp");
myDialog.dialog({
close: function(e, ui) {
$j(this).remove();
$j(".ui-dialog").remove(); // REMOVE EXTRA DIVS
}
});