Clear Inputs when Checkbox becomes unchecked

I am making a form with options in them. The user can pick as many as apply. My code is located here:

<b>Options</b>
<br>
<font size="1"> Please select all options wanted</font>
<br>
<input type="checkbox" id="none" value="X"     onchange="updateText('none')">None
<br>
<input type="checkbox" id="prof" value="P" onchange="updateText('prof')">Profiled w/ Data
<br>
<input type="checkbox" id="slave" value="SL" onchange="updateText('slave')">Slaved each end
<br>
<input type="checkbox" id="silco" value="SN" onchange="updateText('silco')">SilcoNert® Coating
<br>
<input type="checkbox" id="pass" value="PP" onchange="updateText('pass')">Power Pass Through
<br>
<input type="checkbox" id="dur" value="DR" onchange="updateText('dur')">Dursan Coating
<br>
<input type="checkbox" id="thermo" value="TP" onchange="updateText('thermo')">Thermocouple Pass Through
<br>
<input type="checkbox" id="ss" value="SR" onchange="updateText('ss')">Stainless Steel 1/16" Braided Strain Relief
<br>
<br>
<input type="hidden" value="" maxlength="1" size="1" id="profText" />
<input type="hidden" value="" maxlength="1" size="1" id="slaveText" />
<input type="hidden" value="" maxlength="1" size="1" id="silcoText" />
<input type="hidden" value="" maxlength="1" size="1" id="passText" />
<input type="hidden" value="" maxlength="1" size="1" id="durText" />
<input type="hidden" value="" maxlength="1" size="1" id="thermoText" />
<input type="hidden" value="" maxlength="1" size="1" id="options2Text" />
<input type="text" value="" maxlength="1" size="1" id="completeText"   style="width: 200px; border:1px solid #CC0000;" />

< script type = "text/javascript" >

function updateText(type) {
    var id = type + 'Text';
    var endValue;
    var inputValue = document.getElementById(type).value;

    document.getElementById(id).value = inputValue;

    endValue = document.getElementById("seriesText").value;
    if (document.getElementById("tubeText").value != "") {
        endValue = endValue + "-" + document.getElementById("tubeText").value;
    }
    if (document.getElementById("sizeText").value != "") {
        endValue = endValue + "-" + document.getElementById("sizeText").value;
    }
    if (document.getElementById("voltageText").value != "") {
        endValue = endValue + "-" +    document.getElementById("voltageText").value;
    }
    if (document.getElementById("sensorText").value != "") {
        endValue = endValue + "-" + document.getElementById("sensorText").value;
    }
    if (document.getElementById("temperatureText").value != "") {
        endValue = endValue + "-" + document.getElementById("temperatureText").value;
    }
    if (document.getElementById("sleeveText").value != "") {
        endValue = endValue + "-" + document.getElementById("sleeveText").value;
    }
    if (document.getElementById("portText").value != "") {
        endValue = endValue + "-" + document.getElementById("portText").value;
    }
    if (document.getElementById("connectorText").value != "") {
        endValue = endValue + "-" + document.getElementById("connectorText").value;
    }
    if (document.getElementById("lengthText").value != "") {
        endValue = endValue + "-" + document.getElementById("lengthText").value;
    }
   if (document.getElementById("profText").value != "") {
        endValue = endValue + "-" + document.getElementById("profText").value;
    }
    if (document.getElementById("slaveText").value != "") {
        endValue = endValue + "-" + document.getElementById("slaveText").value;
    }
    if (document.getElementById("silcoText").value != "") {
        endValue = endValue + "-" + document.getElementById("silcoText").value;
    }
    if (document.getElementById("passText").value != "") {
        endValue = endValue + "-" + document.getElementById("passText").value;
    }
    if (document.getElementById("durText").value != "") {
        endValue = endValue + "-" + document.getElementById("durText").value;
    }
    if (document.getElementById("thermoText").value != "") {
        endValue = endValue + "-" + document.getElementById("thermoText").value;
    }
    if (document.getElementById("options2Text").value != "") {
        endValue = endValue + "-" + document.getElementById("options2Text").value;
    }
    document.getElementById("completeText").value = endValue;
} < /script>
</body > < /div>
</div > < /div>
</div > < br >

When a user picks the option, the value of the option should appear in the input box at the bottom. However, currently the value stays in the input box when a user chooses an option even if they uncheck the box. Is there a way to clear out that value if the checkbox goes from checked to unchecked using javascript?

I am somewhat new to Javascript/HTML and I have searched around on Google. The results didn't seem to work for my code.