JSFiddle - React, Tailwind, and code Playground
HTML
<button id="create-btn" type="button">Create 10 elements and empty() their parent</button>
<div id="container">
</div>
JavaScript
var USE_DESTROY = false;
var destroyChildren = function(node) {
var c;
while (c = node.lastChild) {
// removeNode is IE only
c.removeNode(false)
}
}
$(document).ready(function() {
var $container = $('#container');
$('#create-btn').click(function() {
for (var i = 0; i<10; i++) {
var frag = document.createDocumentFragment();
var div = document.createElement("div");
frag.appendChild(div);
$container.html(frag);
// null them, just in case
frag = null;
div = null;
if (USE_DESTROY) {
destroyChildren($container.get(0))
} else {
$container.empty();
}
}
});
});