JSFiddle - React, Tailwind, and code Playground

HTML

<form id="formA">
    <input type="checkbox" id="checkboxA"/>
    <input type="text" id="inputA" />
    <input type="checkbox" id="checkboxB" checked/>
    <input type="text" id="inputB" />
</form>

JavaScript

/*
 *  Enabling and disabling of the input field inputA/inputB.
 */
$(document).ready(function() {
    toggleInput('checkboxA', 'inputA');
    toggleInput('checkboxB', 'inputB');
    $('#checkboxA').change(function() {
        toggleInput('checkboxA', 'inputA');
    });
    $('#checkboxB').change(function() {
        toggleInput('checkboxB', 'inputB');
    });
});
/*
 *  Hides and shows the input field inputA/inputB.
 */
function toggleInput(switcherID, fieldID) {
    if($('#' + switcherID).attr('checked')) {
        $('#' + fieldID).show('slow');
    } else {
        $('#' + fieldID).hide();
    }
}