diff --git a/index.html b/index.html
index 315a3f0..172b514 100644
--- a/index.html
+++ b/index.html
@@ -20,6 +20,7 @@ <h1>
     <li><button id="test1">Run Test 1</button></li>
     <li><button id="test2">Run Test 2</button></li>
     <li><button id="test3">Run Test 3</button></li>
+    <li><button id="test4">Run Test 4</button></li>
   </ul>
   <div id='test'>
     The test will be run against this element.
@@ -30,5 +31,6 @@ <h1>
   <script src='test-one.js'></script>
   <script src='test-two.js'></script>
   <script src='test-three.js'></script>
+  <script src='test-four.js'></script>
 </body>
 </html>
diff --git a/test-four.js b/test-four.js
new file mode 100644
index 0000000..e05d406
--- /dev/null
+++ b/test-four.js
@@ -0,0 +1,44 @@
+//
+// Like testTwo, but we detach the top level view.
+// This leads to a single DOM op instead
+// of `n+1` DOM ops.
+//
+
+(function() {
+  var btn = document.querySelector('#test4');
+
+  btn.addEventListener('click', function() {
+
+    // Create our list, and append it to the test node
+    var $list = $('<ul></ul>');
+    var lis = new Array(10000);
+    for(var i=0; i<lis.length; i++) {
+      var $li = $('<li></li>').addClass('l'+i);
+      lis[i] = $li;
+      $list.append($li);
+    }
+    test.$el.append($list);
+
+    // Rather than create a new tree from a template, I'm going ahead and cloning it
+    var $listClone = $list.clone();
+
+    // Kick off the test
+    test.start('three');
+
+    var $span = $('<span>').insertAfter($list);
+    $list.detach();
+
+    // Loop through the children in the cloned tree, replacing
+    // them with cloned versions of the elements in the existing
+    // tree. This causes 0 ops
+    $listClone.children().each(function(index, li) {
+      $(li).replaceWith(lis[index]);
+    });
+
+    // The only op is the replace
+    $list.empty().append($listClone);
+    $span.replaceWith($list);
+
+    test.stop();
+  });
+})();
diff --git a/test-three.js b/test-three.js
index c43fb28..b134262 100644
--- a/test-three.js
+++ b/test-three.js
@@ -11,8 +11,11 @@
 
     // Create our list, and append it to the test node
     var $list = $('<ul></ul>');
-    for(var i=0; i<10000; i++) {
-      $list.append($('<li></li>').addClass('l'+i));
+    var lis = new Array(10000);
+    for(var i=0; i<lis.length; i++) {
+      var $li = $('<li></li>').addClass('l'+i);
+      lis[i] = $li;
+      $list.append($li);
     }
     test.$el.append($list);
 
@@ -26,11 +29,11 @@
     // them with cloned versions of the elements in the existing
     // tree. This causes 0 ops
     $listClone.children().each(function(index, li) {
-      $(li).replaceWith(test.$el.find('.'+li.className).clone(true, true));
+      $(li).replaceWith(lis[index].clone(true));
     });
 
     // The only op is the replace
-    test.$el.find('ul').replaceWith($listClone);
+    test.$el.find('ul').empty().append($listClone);
 
     test.stop();
   });
diff --git a/test-two.js b/test-two.js
index 2daaf18..4453f19 100644
--- a/test-two.js
+++ b/test-two.js
@@ -12,8 +12,11 @@
 
     // Create our list, and append it to the test node
     var $list = $('<ul></ul>');
-    for(var i=0; i<10000; i++) {
-      $list.append($('<li></li>').addClass('l'+i));
+    var lis = new Array(10000);
+    for(var i=0; i<lis.length; i++) {
+      var $li = $('<li></li>').addClass('l'+i);
+      lis[i] = $li;
+      $list.append($li);
     }
     test.$el.append($list);
 
@@ -23,15 +26,17 @@
     // Kick off the test
     test.start('two');
 
+    $list.contents().detach();
+
     // Loop through the children in the cloned tree, replacing
     // them with the children in the existing tree. This gives
     // us 4 removal ops
     $listClone.children().each(function(index, li) {
-      $(li).replaceWith(test.$el.find('.'+li.className));
+      $(li).replaceWith(lis[index]);
     });
 
     // The 5th op is the replace
-    test.$el.find('ul').replaceWith($listClone);
+    test.$el.find('ul').append($listClone.contents());
 
     test.stop();
   });