JQuery Wrap vs Append

Benchmark created by Keith on

Preparation HTML

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script><p id="various_loop_container"></p>
<script>
  var span = "<span>hi</span>",
      spanList = "";
  var target = document.getElementById("various_loop_container");
  var iterations = 100;
  while (iterations--) {
   spanList += span;
  }
  target.innerHTML = spanList;
</script>

Test runner

Ready to run.

Testing in
TestOps/sec
Wrap
$(target).find("span").each(function() {
 var $this = $(this);
 $this.wrap("<b/>");
});
ready
Append
$(target).find("span").each(function() {
 var $this = $(this);
 var clone = $this.clone();
 clone.detach();
 var bTag = $("<b/>");
 bTag.append(clone);
 $this.replaceWith(bTag);
});
ready

Revisions

You can edit these tests or add more tests to this page by appending /edit to the URL.