JSFiddle - React, Tailwind, and code Playground

by gweax

HTML

<form>
    <label>
        Animal:
        <input type="text" name="animal" value="zebra">
    </label>
    
    <input type="reset" value="reset">
    <input type="button" value="redo">
</form>

CSS

label {
    display:block;
    margin-bottom: 0.5em;
}

JavaScript

var resetButton = document.querySelector("input[type=reset]");
var redoButton = document.querySelector("input[type=button]");
var snapshot;

resetButton.addEventListener("click", saveSnapshot, false);
redoButton.addEventListener("click", restoreSnapshot, false);

function saveSnapshot(event) {
    snapshot = this.form.cloneNode(true);
}

function restoreSnapshot(event) {
    if (snapshot) {
        this.form.parentNode.replaceChild(snapshot, this.form);
    }
}