jQuery: keyup(): Update div with content from text area... line breaks?

I have posted a working version here: http://jsfiddle.net/JV2qW/2/

I have a textarea that updates (on keyup()) a div with the text that is being entered. Everything is working as i开发者_如何学运维t should, except the line breaks are not being recognized.

the html:

<p>enter text</p>
<textarea id='text'></textarea>
<div id='target'></div>

and the jquery:

$('#text').keyup(function(){
      var keyed = $(this).val();
      $("#target").html(keyed);
 });

Any thoughts on how to get the \n translated to <br/> or <p> tags?

many thanks.

You can replace any newlines with <br/>

$('#text').keyup(function() {
    var keyed = $(this).val().replace(/\n/g, '<br/>');
    $("#target").html(keyed);
});

You can look into the MDC article about RegEx if you want to replace other things.

https://developer.mozilla.org/en/JavaScript/Guide/Regular_Expressions

http://jsfiddle.net/omnosis/8XL7n/

replace the '\n' to '<br />'

Why don't You just do replace on keyed value and replace it?

Here You have example - section Convert carrage returns

http://lawrence.ecorp.net/inet/samples/regexp-format.php