Render Markdown in text that's coming from a live preview in Javascript

I'm working on a website with ruby on rails where people can make posts and what not. The posts use Markdown for rendering the text just like Stack Overflow. Whenever a user is making a post, there is a live preview div right beneath the text area that show's the user what their post will look like, just like here on stack overflow. My problem is I don't know how to get the Markdown to render on the live preview.

My javascript code for the live preview is

window.onload = function(){
var idea = document.getElementById("idea-text");
try{
    idea.onkeyup = idea.onkeypress = function(){
        document.getElementById('live-preview').ierHTML = this.value.replace(/n/g, '<br/>');
    }
}
catch(e){
}
}  

The text will always be plain text, any pointers on making the Markdown render?