Many Check boxes toggle show/hide

Many Check boxes toggle show/hide

If I have multiple check boxes (like below html code) that, if checked,
show the same data on two fields. So a simple example would be to check
"additional monitor" and "visio" and have "* Required" stay shown.
Html Code:
<table>
<tr>
<td class="newemp_dataGLCCother">
<label for="gl_account">GL Acccount:</label>
<input name="gl_account" id="gl_account" type="text"
maxlength="15" />
<label id="requiredgla" style="display:none"><font size="2"
color="red">* Required</font>
</label>
</td>
</tr>
<tr>
<td class="newemp_dataGLCCother">
<label for="cost_center">Cost Center:</label>
<input id="" name="cost_center" id="cost_center" type="text"
maxlength="15" />
<label id="requiredcc" style="display:none"><font
color="red">*<font size="2"> Required</font></font>
</label>
</td>
</tr>
<tr>
<td>
<input type="checkbox" name="non_standard_software"
value="Additional Monitor" id="additional_monitor"
onclick="showReq('requiredgla'); showReq('requiredcc')"
/>Additional Monitor</td>
</tr>
<tr>
<td>
<input type="checkbox" name="non_standard_software"
value="AutoCAD" id="autocad" onclick="showReq('requiredgla');
showReq('requiredcc')" />AutoCAD</td>
</tr>
<tr>
<td>
<input type="checkbox" name="non_standard_software"
value="MapPoint" id="mappoint" onclick="showReq('requiredgla');
showReq('requiredcc')" />MapPoint</td>
</tr>
<tr>
<td>
<input type="checkbox" name="non_standard_software" value="Visio"
id="visio" onclick="showReq('requiredgla');
showReq('requiredcc')" />Visio</td>
</tr>
<tr>
<td>
<input type="checkbox" name="non_standard_software"
value="Project" id="project" onclick="showReq('requiredgla');
showReq('requiredcc')" />Project</td>
</tr>
<tr>
<td class="newemp_dataGLCCother">
<input type="checkbox" name="non_standard_software" value="other"
id="other" onclick="showReq('otherbox'); showReq('requiredgla');
showReq('requiredcc')" />Other:
<input name="other" id="otherbox" type="text"
style="display:none;" />
</td>
</tr>
Javascript:
function showReq(id) {
var e = document.getElementById(id);
if (e.style.display == 'block')
e.style.display = 'none';
else
e.style.display = 'block';
}
So with this code as is, when you check an odd number of items "*
Required" is shown but if you select an even number of items it is shown.
So I was thinking that if you set a variable to "true" and put that in the
js function that it would eliminate the toggle if you select multiple
items.
ie:
function showReq(id) {
var dbl = true;
var e = document.getElementById(id);
if (e.style.display == 'block' && dbl === true)
e.style.display = 'none';
dbl = false;
else
dbl = true;
e.style.display = 'block';
}
I know that this doesn't work but I'm looking for something similar to
this. Please don't use jQuery unless its completely impossible to use
JavaScript.