JSFiddle - React, Tailwind, and code Playground

by chauhangs

HTML

Add
<input type="text" id="text" style="display:none" />
<br>
<button id="add" onclick="add()" name="add" value="Add">Add</button>
<button id="edit" name="add" value="Edit">Edit</button>
<button id="done" onclick="done()" name="add" value="Done" style="display:none">Done</button>

JavaScript

function add() {
    document.getElementById('edit').style.display = "none";
    document.getElementById('done').style.display = "block";
    document.getElementById('text').style.display = "block";
}

function done() {
    document.getElementById('done').style.display = "none";
    document.getElementById('edit').style.display = "block";
    document.getElementById('text').style.display = "none";

}