Is there a general rule of thumb to avoid orphan nodes? I'm using a
multiselect plugin which I'd like to be able to remove from the DOM
but it is creating orphan nodes in IE and the nodes are not removed
according to sIEve. I suspect it is the order that the elements are
removed from the DOM, but I'm not sure. Here is the example I'm
working from:
<html>
<head>
<script src='jquery.js'></script>
<script src="jqueryMultiSelect.js"></script>
<link href="jqueryMultiSelect.css" rel="stylesheet" type="text/css" />
<script>
function Add(){
$('#selectBin').html('<select id="control_1" name="control_1[]"
multiple="multiple" size="5">'+
'<option value=""></option><option
value="option_1">Option 1</option>'+
'<option value="option_2">Option
2</option>'+
'<option value="option_3">Option
3</option>'+
'<option value="option_4">Option
4</option>'+
'<option value="option_5">Option
5</option>'+
'</select>');
$('#selectBin').find('select').multiSelect();
}
function Remove(){
$('#selectBin').empty();
}
</script>
</head>
<body>
<button onclick='Add()'>Add Select</button>
<button onclick='Remove()'>Remove Select</button>
<table>
<tr>
<td id='selectBin'>
</td>
</tr>
</table>
</body>
</html>
