How do I replace all line breaks in a string with br elements

Question

How can I read the line break from a value with JavaScript and replace all the line breaks with  lt br   gt  elements   Example   A variable passed from PHP as below      This is man        Man like dog       Man like to drink        Man is the king     I would like my result to look something like this after the JavaScript converts it      This is man lt br   gt  lt br   gt Man like dog  lt br   gt Man like to drink  lt br   gt  lt br   gt Man is the king

User · Answer

If your concern is just displaying linebreaks, you could do this with CSS.

<div style="white-space: pre-line">Some test
with linebreaks</div>

Jsfiddle: https://jsfiddle.net/5bvtL6do/2/

Note: Pay attention to code formatting and indenting, since white-space: pre-line will display all newlines (except for the last newline after the text, see fiddle).

User · Answer

It is also important to encode the rest of the text in order to protect from possible script injection attacks  function insertTextWithLineBreaks text  targetElement        var textWithNormalizedLineBreaks   text replace   r n     n        var textParts   textWithNormalizedLineBreaks split   n         for  var i   0  i  lt  textParts length  i              targetElement appendChild document createTextNode textParts i             if  i  lt  textParts length - 1                targetElement appendChild document createElement  br

User · Answer

Not answering the specific question  but I am sure this will help someone     If you have output from PHP that you want to render on a web page using JavaScript  perhaps the result of an Ajax request   and you just want to retain white space and line breaks  consider just enclosing the text inside a  lt pre gt  lt  pre gt  block   var text with line breaks   retrieve some text from php    var element   document querySelectorAll   output    element innerHTML     lt pre gt     text with line breaks     lt  pre gt

User · Answer

For those of you who just want to allow max  2  lt br gt  in a row  you can use this   let text   text replace    r  n  2   g    lt br gt  lt br gt     text   text replace    r  n  g    lt br gt       First line  Search for  n OR  r n where at least 2 of them are in a row  e g   n n n n  Then replace it with 2 br   Second line  Search for all single  r n or  n and replace them with  lt br gt

User · Answer

Try   x000D   x000D  let s  This is man  x000D   x000D       Man like dog  x000D       Man like to drink  x000D   x000D       Man is the king    x000D        x000D  msg innerHTML   s replace   n g   lt br   gt     x000D   lt div id  msg  gt  lt  div gt  x000D   x000D   x000D

User · Answer

This worked for me when value came from a TextBox   string replace   n  r n  r g    lt br  gt

User · Answer

if you send the variable from PHP  you can obtain it with this before sending    string nl2br  string

User · Answer

If the accepted answer isn t working right for you then you might try   str replace new RegExp   n   g      lt br   gt      It worked for me

User · Answer

Regardless of the system   my multiline text replace    mg   lt br gt

User · Answer

It will replace all new line with break   str   str replace   n g    lt br gt         If you want to replace all new line with single break line    str   str replace   n  n g    lt br gt         Read more about Regex   https   dl icewarp com online help 203030104 htm   this will help you everytime

User · Answer

Without regex   str   str split   n   join   lt br   gt

User · Answer

This works for input coming from a textarea  str replace new RegExp   r  n   g      lt br   gt

User · Answer

This will turn all returns into HTML  str   str replace      r n  r  n  g    lt br gt       In case you wonder what    means  It is called a non-capturing group  It means that group of regex within the parentheses won t be saved in memory to be referenced later  You can check out these threads for more information  https   stackoverflow com a 11530881 5042169 https   stackoverflow com a 36524555 5042169

[javascript] How do I replace all line breaks in a string with <br /> elements?

Examples related to javascript