Rendering Youtube Video in a WYSIWYG

Question

I am creating a custom WYSIWYG from scratch using JavaScript. All of it is working fine (like inserting pictures), but when I click on submit and the content gets added to my database, the YouTube video gets inserted like this:

<div><br></div><div><br><div><br></div></div>

I have created a JavaScript file that the WYSIWYG parses to:

function iImage(){
    var imgSrc = prompt('Enter image location', '');
    if (imgSrc != null){
        richTextField.document.execCommand('insertimage', false, imgSrc);
    }
}
function iVideo(){
    var urlPrompt = prompt("Enter Youtube Url:", "http://");
    var urlReplace = urlPrompt.replace("watch?v=", "embed/");
    var embed = '<iframe src="'+urlReplace+'" allowfullscreen="true" width="480" frameborder="0" height="390">';
    if($.browser.msie){
        richTextField.document.createRange().pasteHTML(embed);
    }else{
        richTextField.document.execCommand("Inserthtml", false, embed);
    }
}
function submit_form(){
    var theForm = document.getElementById("blogForm");
    theForm.elements["blogbody"].value = window.frames['richTextField'].document.body.innerHTML;
    theForm.submit();
}

You can see that my iImage function works, but not my iVideo.

Can anyone help?

Just to let you know i have edited my script to this...

function iVideo(){
    var urlPrompt = prompt("Enter Youtube Url:", "http://");
    var urlReplace = urlPrompt.replace("http://www.youtube.com/watch?v=", "http://www.youtube.com/embed/");
    var embed = '<iframe src="'+urlReplace+'" allowfullscreen="true" width="480" frameborder="0" height="390"></iframe>';
    if($.browser.msie){
        richTextField.document.createRange().pasteHTML(embed);
    }else{
        richTextField.document.execCommand("Inserthtml", false, embed);
    }
}

but still no joy

Answer 1

I have got it. This is the code below

function iVideo(){
    var urlPrompt = prompt("Enter Youtube Url:", "http://");
    var urlReplace = urlPrompt.replace("watch?v=", "embed/");
    var embed = '<iframe title="YouTube video player" src="'+urlReplace+'" allowfullscreen="true" width="480" frameborder="0" height="390">';
    if(embed != null){
        richTextField.document.execCommand("Inserthtml", false, embed);`
    }
}

It working on my sites right now.