\n is not creating a new line between text in javascript

Question

I have a piece of JavaScript that is supposed to update a in my HTML:

var StringContent = ({
    \"a\": \'Some String a\',
    \"b\": \'Some string b\',
            


        

Answer 1

You should replace \n by <br> since innerHTML takes an HTML string (in HTML, \n merges with adjacent spaces but does not produce a carriage return except for elements with the style white-space:pre-wrap as noted by MaxArt) :

document.getElementById("overlaycontent").innerHTML = (
    StringContent.a + '<br>' +
    StringContent.b + '<br>' +
    StringContent.c,
)

Answer 2

CSS! white-space! pre-wrap! Learn about it!

<div style="white-space: pre-wrap">




                       SPAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACE!

Newlines totally work now!
</div>

Answer 3

\n (or sometimes \r\n) will work when outputting to a text element such as <textarea> or to a .txt document, but <br> is required for HTML.

Answer 4

for innerHTML you need '<br />'

document.getElementById("overlaycontent").innerHTML = (
    StringContent.a + '<br />' +
    StringContent.b + '<br />' +
    StringContent.c
    )

but for an alert you can use : String.fromCharCode(10) instead of '\n'

alert(
    StringContent.a + String.fromCharCode(10) +
    StringContent.b + String.fromCharCode(10) +
    StringContent.c
    )