JSFiddle - React, Tailwind, and code Playground

HTML

<div class="ccms_form_element cfdiv_custom" id="page1title_container_div" style=""><h3>Page 1/3 - Personal Information</h3>
<p>Give us some background about yourself</p><div class="clear"></div><div id="error-message-page1title"></div></div><div class="ccms_form_element cfdiv_checkbox" id="freeinvestigation1_container_div" style=""><input type="hidden" name="freeinvestigation" value="" alt="ghost" />
<input checked="checked" value="1" title="" type="checkbox" name="freeinvestigation" id="freeinvestigation" class="label_right" />
<label for="freeinvestigation" class="full_label">Yes! I would like to have Deng Tax provide a FREE investigation on my personal tax matter.</label><div class="clear"></div><div id="error-message-freeinvestigation"></div></div><div class="ccms_form_element cfdiv_text" id="firstname1_container_div" style=""><label>First Name:</label><input maxlength="150" size="30" class=" validate['required']" title="" type="text" value="" name="firstname" />
<div class="clear"></div><div id="error-message-firstname"></div></div><div class="ccms_form_element cfdiv_text" id="lastname1_container_div" style=""><label>Last Name:</label><input maxlength="150" size="30" class=" validate['required']" title="" type="text" value="" name="lastname" />
<div class="clear"></div><div id="error-message-lastname"></div></div><div class="ccms_form_element cfdiv_text" id="address1_container_div" style=""><label>Address:</label><input maxlength="150" size="30" class=" validate['required']" title="" type="text" value="" name="address" />
<div class="clear"></div><div id="error-message-address"></div></div><div class="ccms_form_element cfdiv_text" id="city1_container_div" style=""><label>City:</label><input maxlength="150" size="30" class=" validate['required']" title="" type="text" value="" name="city" />
<div class="clear"></div><div id="error-message-city"></div></div><div class="ccms_form_element cfdiv_select" id="state1_container_div"...

JavaScript

window.addEvent('domready', function() {
$('cf_container_74').setStyle('display','none');
$('cf_container_76').setStyle('display','none');
$('cf_container_78').setStyle('display','none');
$('cf_container_80').setStyle('display','none');
alert('all hidden');

$('havenotfiled').addEvent('change',function() { 
    var valueNotFiled = $('havenotfiled').get("value"); 
    if (valueNotFiled == 'No'){
    $('cf_container_74').setStyle('display','none');
    } else if (valueNotFiled == 'Yes'){
    $('cf_container_74').setStyle('display','block');
    }
});

$('paymentplan').addEvent('change',function(){
    var valuePayPlan = $('paymentplan').get("value");
    if (valuePayPlan == 'No'){
    $('cf_container_76').setStyle('display','none');
    $('cf_container_78').setStyle('display','none');
    $('cf_container_80').setStyle('display','none');
    } else if (valuePayPlan == 'Yes'){
    $('cf_container_76').setStyle('display','block');
    $('cf_container_78').setStyle('display','none');
    $('cf_container_80').setStyle('display','none');        
    }
});

$('payordefault').addEvent('change',function(){
    var valueDefault = $('payordefault').get("value");
    if (valueDefault == 'InDefault'){
    $('cf_container_78').setStyle('display','block');
    $('cf_container_80').setStyle('display','none');
    } else if (valueDefault == 'StillPaying'){
    $('cf_container_78').setStyle('display','none');
    $('cf_container_80').setStyle('display','block');        
    } else if (valueDefault == 'NotApplicable'){
    $('cf_container_78').setStyle('display','none');
    $('cf_container_80').setStyle('display','none');       
	}
});
    
});