[jQuery] How do I get $().text() to read current (not original) textarea text?

[jQuery] How do I get $().text() to read current (not original) textarea text?


I am trying to create a textarea with a "live" preview beneath it. I
want to be able to type text or html and get the div block underneath
to update with the current contents of the textarea each time a key is
released.
The following code snippet nearly achieves my intent, but I find an
unexpected result : the div block is only updated with the original
text coded into the HTML ("Your comments go here.") and not the text
that has been typed by the user after the page has loaded.
How do I fix this?
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<script src="jquery.js"></script>
<script>
$(document).ready(function()
{
$("#Comments").keyup(function ()
{
$("#previewPane").replaceWith("<div>"+ $("#Comments").text() +
"</div>");
});
});
</script>
</head>
<body>
<form action="" method="post" name="form1" id="form1">
<textarea name="Comments" id="Comments" rows="8" cols="40">Your
comments go here.</textarea><br/>
<input type="submit" value="Submit" />
</form>
<div id="previewPane">Initial text.</div>
</body>
</html>