JSFiddle - React, Tailwind, and code Playground

by Neal

HTML

<p>
    with some text 
    <br/>
    and another line
    <br/>
    and another line
</p>

<p>
    with some text 
    <br/>
    and another line
    <br/>
    and another line
</p>

CSS

p {
    margin: 5px;
}

.break {
    margin-left: 10px;
}

JavaScript

$('p').each(function(){
    
    var html = this.innerHTML;
    var htmlArray = html.split('<br>');
    var new_html = htmlArray[0];
    
    for(var i = 1; i < htmlArray.length; i++){
        new_html += "<div class='break'>"+htmlArray[i]+"</div>";
    }
    
    this.innerHTML = new_html;
    
});