JSFiddle - React, Tailwind, and code Playground

HTML

<script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.4/jquery-ui.min.js"></script>
<link rel="stylesheet" href="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.4/themes/smoothness/jquery-ui.css">
<h1 id="result">Javascript Exm</h1>

<textarea id="txt1" rows="10" cols="100" readonly="readonly"></textarea>
<textarea id="txt" rows="4" cols="50" onclick="eraseText()"></textarea>
<input type="button" onclick="displayOut()" value="click">
<script type="text/javascript">
    function eraseText() {
        document.getElementById("txt").value = "";
    }

    function displayOut() {
        var input = document.getElementById("txt").value;
        var text2 = document.getElementById("txt1");
        text2.value = input;
        if (input.length === 0) {
            alert("Please enter a valid input");
            return;
        }
        eraseText();

    }
</script>