Question: I see all sorts of jQuery options such as append, prepend, appedTo etc. but I just want to take out the content of a div and append it to the inside of the body. The whole contents, so not by using .html() but being loads of other divs. These divs may have events attached as well so I don't want to mess them all up.

```
<div id="main">
    <div id="anything" class="anything">
        <p>hello etc.</p>
    </div>
</div>

```

So I need to take out everything inside id="main"

So, something like $('#main').get-its-contents-and-append-to('body') would do it.

I guess I could write a lengthy script, but there must be a simple one-line jQuery option?

Answer: 
Something like this:

```
$('#main').detach().children().appendTo('body');

```

Omit the `.detach()` part if you want to leave the `#main` div in place but empty.

This will retain any event handlers or data associated with the elements being moved, as you can see here: <http://jsbin.com/iguqew/1/edit>
You should be able to use `append`:

```
$("body").append($("#main").html());
$("#main").empty();

```

You could also do this which should keep the event handlers in place:

```
$('body').append($("#main").children());

```