JSFiddle - React, Tailwind, and code Playground

HTML

<input type="checkbox" id="item1"   data-info-id="info1"/>
<label for="item1"> Item 1 Checkbox</label><br/>
<div id="info1">
Content checkbox group
</div>
</p>

<input type="radio" id="jb1" name="jb" />
<label for="jb1"> Item2 Radio</label><br/>  
<input type="radio" id="jb2" name="jb" />
<label for="jb2"> Item3 Radio </label><br/>  
<input type="radio" id="jb3" name="jb" data-info-id="info2"/>
<label for="jb3">Item4 Radio</label><br/> 

<div id="info2">
Content radio group
</div>

CSS

[id^="info"] { 
          
          display: none;
    }

JavaScript

document.addEventListener('change', function(e) {
          var id = e.target.getAttribute('data-info-id');
          var checked = e.target.checked;
          if (id) {
            var div = document.getElementById(id);
            if (div)
              div.style.display = checked ? 'block' : 'none';
          }

        });