JSFiddle - React, Tailwind, and code Playground

HTML

<form>
    <input type="text" placeholder="First Name" required id="fname" name="fname" />
    <input type="text" placeholder="Last Name" required id="lname" name="lname" />
    <input type="checkbox" placeholder="Maiden Name" id="maidenname" name="chkname" />
    <input type="text" placeholder="Maiden Name" id="mname" name="mname" />
</form>

CSS

#mname {
    display:none;
}

JavaScript

var checkbox = document.getElementById('maidenname');
var input = document.getElementById('mname');
checkbox.addEventListener('click', function () {
    if (input.style.display != 'block') {
        input.style.display = 'block';
    } else {
        input.style.display = '';
    }
});