Help needed with 'simple' SEO JavaScript form

[justletgo]

Hi Coders...

I'm building a 'really simple' JavaScript program to help editors write SEO-friendly META titles and META descriptions. The idea is you have 3 text boxes, each on a separate line:

BOX 1 - META TITLE [ i.e. "Cool website page" ]
BOX 2 - FILE NAME [ i.e. "This is a really cool web page about cool stuff"]
BOX 3 - META DESCRIPTION [ i.e. "cool-web-page" ]

As the editor types in the boxes, a serp listing is displayed as it would appear on Google (and ideally how it would appear on Bing and Yahoo):

Cool website page
www.coolwebsite.com/cool-web-page
This is a really cool web page about cool stuff

Kudos to any one who could point a JavaScript newbie in the right direction

[rangana]

Hope this gets you started:

<script type="text/javascript">
function update(el, target) {
	document.getElementById(target).innerHTML = el.value;
}
</script>
<label for="title">Meta Title: </label><input id="title" onkeyup="update(this, 'el_title')" type="text"><br>
<label for="file_name">File Name: </label><input id="file_name" type="text"><br>
<label for="meta_desc">Meta Description: </label><input id="meta_desc" onkeyup="update(this,'el_meta')" type="text"><br><br>

<fieldset style="width:400px;border:1px solid #999"><legend>...as appears on Google</legend>
	<strong style="color:#00f;font-size:12pt;" id="el_title">Cool website page</strong><br>
	<span style='color:green;'>www.coolwebsite.com/cool-web-page</span><br>
	<span id="el_meta">This is a really cool web page about cool stuff</span>
</fieldset>

[justletgo]

Really appreciate your help on this Ray. Code works a treat. I'm gonna have a lot of fun tweaking it now. Kudos to you sir!