JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://code.jquery.com/jquery-2.2.1.min.js"></script>
<div contenteditable="true" id="myDiv">
put a text... and press mutiples ENTER
</div>

<button type="button" id="myButton">Go!</button>

<div contenteditable="false" id="myDiv2" class="invisible"></div>
<div contenteditable="false" id="myDiv3" class="invisible"></div>

CSS

#myDiv {
  border: 1px solid red;
}
#myDiv2 {
  border: 1px solid green;
}
#myDiv3 {
  border: 1px solid blue;
}

.invisible {
  display: none;
}

.visible {
  display:show;
}

JavaScript

$(document).on('click','#myButton',function() {
	if (navigator.userAgent.toLowerCase().indexOf('chrome') > -1)
		var str = $('#myDiv').html().replace(/<br>/gi,'').replace(/<div>/gi,'<br>').replace(/<\/div>/gi,'');
	else if (navigator.userAgent.toLowerCase().indexOf("firefox") > -1)
		var str = $('#myDiv').html().replace(/<\/br>/gi,'').replace(/<br>/gi,'<br>').replace(/<\/br>/gi,'');
	else if (navigator.userAgent.toLowerCase().indexOf("msie") == -1)
		var str = $('#myDiv').html().replace(/<br>/gi,'').replace(/<p>/gi,'<br>').replace(/<\/p>/gi,'');
    
    $('#myDiv2').removeClass('invisible').addClass('visible').text(str);
    $('#myDiv3').removeClass('invisible').addClass('visible').html(str);
    
});