JSFiddle - React, Tailwind, and code Playground

HTML

<textarea id="ta01"><h3>Questo è bello</h3></textarea>
    <button id="test">Generator</button>   
    <p>.html( .val() )</p>
    <div id="res01"></div>
     <p>.text( .html() )</p>
    <div id="res02"></div>
     <p>.text( .text() )</p>
    <div id="res03"></div>
     <p>.append( .val( ))</p>
    <div id="res04"></div>
    <div id="res05"></div>

CSS

div{
 border:1px solid #afafaf;
    border-radius:6px;
    line-height:20px;
    margin:6px;
    padding:6px;
    color:#000;
    font-family:verdana;
    font-size:14px;
}

JavaScript

var taText = $('#ta01');
console.log(taText);
$('#test').on('click',function(e){
    e.preventDefault();
      console.log('clicked');
    $('#res01').html(taText.val());
    $('#res02').text(taText.html());
    $('#res03').text(taText.text());
    $('#res04').append(taText.val());
    
    
});