JSFiddle - React, Tailwind, and code Playground
HTML
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div id="text"></div>
<!-- expected outcome
HEADER TITLE
This is a small description.
This is another description that is slighly larger then the first description.
This is the final description relative to the title, It may contain Uppercase or lowercase ChArAcTers.
-->
JavaScript
var r = /\W+(?=[A-Z][a-z]{2})/g,
s = 'HEADER TITLE This is a small description. This is another description that is slighly larger then the first description. This is the final description relative to the title, It may contain Uppercase or lowercase ChArAcTers.',
o = s.replace(r, '<br />');
console.log(s.replace(r, '<br />'));
$( document ).ready(function() {
$('#text').append(o)
});