JSFiddle - React, Tailwind, and code Playground

HTML

<input id="C0" type="checkbox" value="true" onchange="t0Disp()" /> Topic 0
<br />
<div id="0div" style="display: none">
  <input type="radio" name="r0" value="0" onchange="disable0(); disable0();" />
  <br />
  <br />
</div>

<input id="C1" type="checkbox" value="true" onchange="t1Disp()" /> Topic 1
<br />
<div id="1div" style="display: none">
  <input type="radio" name="r1" value="0" onchange="disable1(); disable1();" />
  <br />
  <br />
</div>

<input id="C2" type="checkbox" value="true" onchange="t2Disp()" /> Topic 2
<br />
<div id="2div" style="display: none">
  <input type="radio" name="r2" value="2" onchange="disable0(); disable2();" />
  <br />
  <br />
</div>

<input id="C3" type="checkbox" value="true" onchange="t3Disp()" /> Topic 3
<br />
<div id="3div" style="display: none">
  <input type="radio" name="r3" value="0" onchange="disable3(); disable3();" />
  <br />
  <br />
</div>

<input id="C4" type="checkbox" value="true" onchange="t4Disp()" /> Topic 4
<br />
<div id="4div" style="display: none">
  <input type="radio" name="r4" value="0" onchange="disable4(); disable4();" />
  <br />
  <br />
</div>

<input id="C5" type="checkbox" value="true" onchange="t5Disp()" /> Topic 5
<br />
<div id="5div" style="display: none">
  <input type="radio" name="r5" value="5" onchange="disable5(); disable5();" />
  <br />
  <br />
</div>

JavaScript

for (var i=0; i<6; i++) {
        window['t' + i + 'Disp'] = (function() {
            var idiv = i + "div";
            var eldiv = document.getElementById(idiv);
            var ci = "C" + i;
            var elci = document.getElementById(ci);

            return function() {
                if(elci.checked == true) {
                    eldiv.style.display = "inherit";
                } else {
                    eldiv.style.display = "none";
                }
            };
        })();
    }