Append a <br/> tag to a value inside a textarea jquery

Question

How would you append a
tag on a value inside a textarea, it only appends it after a keypress of SHIFT+ENTER,

here is my code to append on the text area and it does not work??

$('#textarea').append("<br/>"); i think there are still something lacking.

DEMO

Thank you. . .

Answer 1

Are you actually wanting to place the characters in the value?

​$("textarea").val(function(i,v){
    return v + "<br/>";
});​​​​

Or simply add a new line?

​$("textarea").val(function(i,v){
    return v + "\nfoo";
});​​​​​​​

Fiddle: http://jsfiddle.net/jonathansampson/SNeyy/

If you want to respond only to shift + enter :

$("textarea").on("keypress", function(e){
    if ( e.which === 13 && e.shiftKey ) {
        $(this).val(function(i,v){
            return v + "<br/>"; // or return v + "\n"; (whatever you want)
        });
    }
});​​​​

Fiddle: http://jsfiddle.net/jonathansampson/SNeyy/1/

Answer 2

You are trying to change the value of the textarea . To add the string "<br/>" you have to use

$('#textarea').val($('#textarea').val() + '<br/>');

and to add a new line you have to use

$('#textarea').val($('#textarea').val() + "\n");

Textarea can have only a text node as its child. <textarea><br/></textarea> is incorrect usage. If you want to add the string "<br/>", the html code should be

<textarea>&lt;br/&gt;</textarea>

and to add a new line, the html code should be

<textarea>
</textarea>

In other words, you cannot use <textarea><br/></textarea>