How do I display new line in .text() in jQuery?

Question

I have the following code:

var stringDisplay = "Hello\nWorld";
$("#meaning").text(stringDisplay);

It is displaying \n instead of a newline.

The output is showing up as Hello\nWorld.

I used <br> tag also in place of \n, but it's still not working.

Answer 1

You will have to use both .html() and replace the newline:

var escaped = $('<div>').text(stringDisplay).text();
$('#meaning').html(escaped.replace(/\n/g, '<br />'));

An alternative would be to style the element:

white-space: pre-wrap;