I have a String with \n - line breaks in Javascript, that I want to replace for another text using createTextNode() in Javascript.

<script type="text/javascript">

function changeText() {

var Explanation="Test\n Test2";

var parent3 = document.getElementById("The_Explanation"); 
parent3.innerHTML='';  
var myP3 = document.createElement("p");
var myText3 = document.createTextNode(""+Explanation);
myP3.appendChild(myText3);
parent3.appendChild(myP3);
}
</script>

All tries to get the line break into the new text failed so far. All functions that replace \n to <br> only bring me to the result

"Test<br> Test2"

Any ideas anyone?

I have a String with \n - line breaks in Javascript, that I want to replace for another text using createTextNode() in Javascript.

<script type="text/javascript">

function changeText() {

var Explanation="Test\n Test2";

var parent3 = document.getElementById("The_Explanation"); 
parent3.innerHTML='';  
var myP3 = document.createElement("p");
var myText3 = document.createTextNode(""+Explanation);
myP3.appendChild(myText3);
parent3.appendChild(myP3);
}
</script>

All tries to get the line break into the new text failed so far. All functions that replace \n to <br> only bring me to the result

"Test<br> Test2"

Any ideas anyone?

• javascript
• line-breaks
• createtextnode

2 Answers 2

You can't put an element node inside a text node. Text nodes cannot have child nodes.

1. Split your string on new lines
2. Loop over the array and generate a text node for each part
3. Use createElement('br') to create a line break to go between each text node
4. append all of the above

You can use replace for that:

   Explanation.replace( /\n/g, "<br />" )l