Adding a new line to text string with jquery .text() method

Question

When I do:

function testtext()
{
    var text = "test line 1\n\
    test line 2"
    ;
    $("#divtext").text(text);   
}

It all appears on one line. When I do:

function testtext()
{
    var text = "test line 1\n\
    test line 2"
    ;
    document.getElementById("divtext").innerText = text;    
}

It works fine...

Well a new line in HTML is created using the <br /> element, not a "normal" line break. — Felix Kling
– Felix Kling, Commented Jul 5, 2011 at 1:15

Sukesh Chand · Accepted Answer · 2013-07-04 17:04:36Z

3

Use $("#divtext").html(text);

Instead of $("#divtext").text(text);

edited Jul 4, 2013 at 17:04

user663031

answered Jul 4, 2013 at 16:44

Sukesh Chand

3,1473 gold badges26 silver badges29 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

user113716 · Accepted Answer · 2011-07-05 01:16:35Z

0

If you're wondering why, it's because jQuery creates a new text node using document.createTextNode, passing your string as the argument.

This apparently behaves differently than innerText, though it seems to behave the same as setting .textContent and as explicitly setting the value of a textNode through .nodeValue or .data.

answered Jul 5, 2011 at 1:16

user113716

323k64 gold badges454 silver badges441 bronze badges

2 Comments

kobe Over a year ago

if you have few minutes can you explain me what the OP has asked?

user113716 Over a year ago

@kobe: Near as I can tell, OP is wondering why the difference. At least that's what I'm going with on this one.

joseph · Accepted Answer · 2011-07-05 01:18:10Z

0

The text() method will do an HTML escape. There are some workarounds on the API page, but perhaps the text() method isn't best suited for what you want to do?

http://api.jquery.com/text/

answered Jul 5, 2011 at 1:18

joseph

7807 silver badges20 bronze badges

Collectives™ on Stack Overflow

Adding a new line to text string with jquery .text() method

3 Answers 3

Comments

2 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

2 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related