I'm trying to loop over the children of body and replace body with the child's HTML. I have this code so far.

```
 <script type="text/javascript">
      $(document).ready(function(){
        $(':submit').click(function() {
         var children = $('body').children();
         var arChildren = $.makeArray(children);
         for (var i = 0; i < arChildren.length; i++) {
           var htmlText = arChildren[i].innerHTML();
           $('body').replaceWith(htmlText);
         }
        });
      });
    </script>

```

Could you advise me what am I doing wrong?

clarification: When I first click on button the `<body>` will be replaced with it's first child, when I second click the body will be replaced with it's second child (but the original) ... then third ... and last, then the button can be inactive. But the button shouldn't dissapear (it's under the body too).

thank you