JSFiddle - React, Tailwind, and code Playground

HTML

<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<script language="JavaScript">
function showInput() {
    var message_entered =  document.getElementById("user_input").value;

    document.getElementById('display').innerHTML = message_entered;
    
    var data = "<p>This is new tab'</p><br/>"+message_entered;
    newWindow = window.open("data:text/html," + encodeURIComponent(data),
                       "_blank", "width=200,height=100");
    newWindow.focus();
}

  </script>

 </head>
 <body>

<form>
<label><b>Enter a Message</b></label>
<input type="text" name="message" id="user_input">
</form>

<input type="submit" onclick="showInput();"><br />
<label>Your input: </label>
<p><span id='display'></span> </p>
</body>
</html>