JSFiddle - React, Tailwind, and code Playground

HTML

<form>
    <div id="display"></div>
    <input type="hidden" value="5" />
    <input type="hidden" value="Jack" />
    <input type="hidden" value="Hamburger" />
    <input type="hidden" value="582.2493" />
    
    <input type="button" value="Show Current Values" id="toggleVisibleValuesButton" />
    <input type="button" value="Change Values" id="changeValuesButton" />
    
    <input type="reset" />
</form>

JavaScript

;(function (undefined) {
    var i, j, form, element;
    
    var onFormReset = function (e) {
        var i, defaultValue;
        
        for (i = 0; i < this.elements.length; i++) {
            element = this.elements[i];
            
            if (element.type !== 'hidden')
                continue;
            
            this.elements[i].value = element.getAttribute('data-default');
        }
    };
    
    for (i = 0; i < document.forms.length; i++) {
        form = document.forms[i];
        
        for (j = 0; j < form.elements.length; j++) {
            element = form.elements[j];
            
            if (element.type !== 'hidden')
                continue;
            
            element.setAttribute('data-default', element.value);
        }
        
        form.addEventListener('reset', onFormReset);
    }
})();

document.getElementById('toggleVisibleValuesButton').addEventListener('click', function (e) {
    var i, str = '', form = document.forms[0], element;
    
    for (i = 0; i < form.elements.length; i++) {
        element = form.elements[i];
        
        if (element.type === 'hidden') {
            str += element.value + ';';
        }
    }
    
    document.getElementById('display').innerText = str;
});

document.getElementById('changeValuesButton').addEventListener('click', function (e) {
    document.forms[0].elements[0].value = "16";
    document.forms[0].elements[1].value = "Mary";
    document.forms[0].elements[2].value = "Burrito";
    document.forms[0].elements[3].value = "9824.248";
});