JSFiddle - React, Tailwind, and code Playground

HTML

<input type="radio" id="state_1_1" name="state1"/>State 1_1&nbsp;&nbsp;|&nbsp;
<input type="radio" id="state_2_1" name="state1"/>State 2_1
<br/><br/>
Text 1_1: <input type="text" id="textField_1_1" /><br/>
Text 2_1: <input type="text" id="textField_2_1" /><br/>
Text 3_1: <input type="text" id="textField_3_1" /><br/>
<hr/>
<input type="radio" id="state_1_2" name="state2"/>State 1_2&nbsp;&nbsp;|&nbsp;
State 2_2: <input type="radio" id="state_2_2" name="state2"/><br/>
Text 1_2: <input type="text" id="textField_1_2" /><br/>
Text 2_2: <input type="text" id="textField_2_2" /><br/>
Text 3_2: <input type="text" id="textField_3_2" />
<br/>

JavaScript

function doState1(theid) {
            var idarr = theid.split("_");
            var state = idarr[1];
            var idval = idarr[2];
            console.log("state1: idval=" + idval + ", state=" + state);
            $("#textField_1_" + idval).attr("disabled", "disabled");
            $("#textField_2_" + idval).removeAttr("disabled");
            $("#textField_3_" + idval).removeAttr("disabled");
        }

        function doState2(theid) {
            var idarr = theid.split("_");
            var state = idarr[1];
            var idval = idarr[2];
            console.log("state2: idval=" + idval + ", state=" + state);
            $("#textField_1_" + idval).removeAttr("disabled");
            $("#textField_2_" + idval).attr("disabled", "disabled");
            $("#textField_3_" + idval).attr("disabled", "disabled");
        }

        $(document).ready(function () {

            if ($("#state_1_1").is(":checked")) {
                doState1("state_1_1");
            } else {
                doState2("state_2_1");
            }

            $('input[id^="state_1_"]').change(function () {
                doState1(this.id);
            });

            $('input[id^="state_2_"]').change(function () {
                doState2(this.id);
            });
        });