JSFiddle - React, Tailwind, and code Playground

HTML

<input type="radio" name="fullorfirst" id="fullname" onClick="nameChoice()" checked /> Full name <strong>-OR-</strong>
<input type="radio" name="fullorfirst" id="firstlast" value="firstnameradio" onClick="nameChoice()"/> First/Last name<br /><br />

<div id="justfull">
    <input type="checkbox" name="fullnamefield" value="fullname" checked>
    <span>Full name</span><br /><br />
</div>
    
    
<div id="firstandlast">
    <input type="checkbox" name="fnamefield" value="fname" disabled>
    <span>First name</span><br /><br />
    <input type="checkbox" name="lnamefield" value="lname" disabled>
    <span >Last name</span><br /><br />
</div>

CSS

.disabled span{color:#ccc;}
.enabled span{color:#444;}

JavaScript

window.nameChoice = function() {
    if(document.getElementById('fullname').checked) {
        
      // Full name wrapper = class of enabled 
      var d = document.getElementById('justfull');
	  d.className = d.className + " enabled";
	  // If also had class of disabled, remove this class
	  var oldclass="disabled"; 
	  d.className=d.className.replace(oldclass,"");
      
      // fname lname wrapper = class of disabled
      var other = document.getElementById('firstandlast');
      other.className = other.className + " disabled";

      // TODO Full name checkbox = checked
      // TODO Full name checkbox = disabled
      // TODO fname lname checkboxes = disabled
        
    }else if(document.getElementById('firstlast').checked) {

      // fname lname wrapper = class of enabled
      var d = document.getElementById('firstandlast');
	  d.className = d.className + " enabled";
	  // If also had class of disabled, remove this class
	  var oldclass="disabled"; 
	  d.className=d.className.replace(oldclass,"");

	  // full name wrapper = class of disabled
	  var other = document.getElementById('justfull');
      other.className = other.className + " disabled";


      // TODO fname lname checkboxes = enabled
      // TODO fname checkbox = checked
      // TODO full name checkbox = disabled
      // TODO full name checkbox = unchecked
    }
}