How do I control where Ember.js appends the rendered application template?

Question

I'm trying to switch my Ember application over to using the Ember.Router but am having an issue with where the application template gets appended. When I call App.initialize() it renders the template at the end of the document. Is there a way to specify where the rendered application template gets appended to?

My application is a rails app and I'm trying to embed an Ember application on one of my pages. I don't want to change the way my current header and footer gets rendered so ideally I would be able to specify where ember renders the template.

Here is a jsfiddle example. You can see that it renders:

Header Content 
Footer Content 
Test 1 
Test 2 
Test 3

What I'm trying for is:

Header Content
Test 1
Test 2
Test 3
Footer Content

Answer 1

Set the rootElement property of the Ember.Application: http://jsfiddle.net/vAxkL/3/

Doc: http://docs.emberjs.com/symbols/Ember.Application.html

EDIT -- Fixed the fiddle by anchoring to the 1.0.pre version: http://jsfiddle.net/vAxkL/11/