Trying to get expand(this), switchcontent, JavaScript to work with Checkbox- I have a bug!

Hello,
  I have a Checkbox that, when unchecked, expands Credit Card information.  What I have currently works on initial upload to my IE browser.  That is, the box default is checked, and Credit Card information does not appear.  However, when I refresh the browser, the Checkbox remains checked and the Credit Card information expands itself.
  My toggle seems to work when I uncheck the Checkbox, then re-check it.  The whole problem is that something in my code is "buggy" if somebody refreshes my site or re-enters later.

  Here is my javascript:

------------------------------------------------------

var enablepersist="on" //Enable saving state of content structure? (on/off)
if (document.getElementById){
document.write('<style type="text/css">')
document.write('.switchcontent{display:none;}')
document.write('</style>')
}
function getElementbyClass(classname){
ccollect=new Array()
var inc=0
var alltags=document.all? document.all : document.getElementsByTagName("*")
for (i=0; i<alltags.length; i++){
if (alltags[i].className==classname)
ccollect[inc++]=alltags[i]
}
}
function contractcontent(omit){
var inc=0
while (ccollect[inc]){
if (ccollect[inc].id!=omit)
ccollect[inc].style.display="none"
inc++
}
}
function expandcontent(cid){
if (typeof ccollect!="undefined"){

document.getElementById(cid).style.display=(document.getElementById(cid).style.display!="block")? "block" : "none"
selectedItem=cid+"|"+document.getElementById(cid).style.display
}
}

function closecontent(tid){
if (typeof ccollect!="undefined"){

document.getElementById(tid).style.display= "none"
selectedItem=tid+"|"+document.getElementById(tid).style.display
}
}

function opencontent(sid){
if (typeof ccollect!="undefined"){

document.getElementById(sid).style.display= "block"
selectedItem=sid+"|"+document.getElementById(sid).style.display
}
}

function revivecontent(){
selectedItem=getselectedItem()
selectedComponents=selectedItem.split("|")
contractcontent(selectedComponents[0])
document.getElementById(selectedComponents[0]).style.display=selectedComponents[1]
}
function get_cookie(Name) {
var search = Name + "="
var returnvalue = "";
if (document.cookie.length > 0) {
offset = document.cookie.indexOf(search)
if (offset != -1) {
offset += search.length
end = document.cookie.indexOf(";", offset);
if (end == -1) end = document.cookie.length;
returnvalue=unescape(document.cookie.substring(offset, end))
}
}
return returnvalue;
}
function getselectedItem(){
if (get_cookie(window.location.pathname) != ""){
selectedItem=get_cookie(window.location.pathname)
return selectedItem
}
else
return ""
}
function saveswitchstate(){
if (typeof selectedItem!="undefined")
document.cookie=window.location.pathname+"="+selectedItem
}
function do_onload(){
getElementbyClass("switchcontent")
if (enablepersist=="on" && getselectedItem()!="")
revivecontent()
for(i=0;i<ccollect.length;i++){
    if(ccollect[i].id.replace(/\d/g,'')=="C"){
      expandcontent(ccollect[i].id)
    }
  }
}

function toggle(theLink){
  theDiv = theLink.parentNode;
  while(theDiv.nodeName!="DIV"){
    theDiv = theDiv.parentNode;
  }
  iNum = theDiv.id.replace(/\D/g,'');
  dTyp = theDiv.id.replace(/\d/g,'');
  dNext = (dTyp=="C")?"O":"C";
  document.getElementById(dNext+iNum).style.display = "block";
  theDiv.style.display = "none";
}

function expand(theBox){
  var cEx = (theBox.checked==true)?"O":"C";
  for(i=0;i<ccollect.length;i++){
    closecontent(ccollect[i].id)
    if(ccollect[i].id.replace(/\d/g,'')==cEx){
      expandcontent(ccollect[i].id)
    }
  }
}

function contract(theBox){
  var cEx = (theBox.checked==false)?"O":"C";
  for(i=0;i<ccollect.length;i++){
    closecontent(ccollect[i].id)
    if(ccollect[i].id.replace(/\d/g,'')==cEx){
      expandcontent(ccollect[i].id)
    }
  }
}


if (window.addEventListener)
window.addEventListener("load", do_onload, false)
else if (window.attachEvent)
window.attachEvent("onload", do_onload)
else if (document.getElementById)
window.onload=do_onload
if (enablepersist=="on" && document.getElementById)
window.onunload=saveswitchstate


-----------------------------------------------------------

  Here's my function call:


<td width="875"><font size="3">Method of payment:</font>&nbsp; <form><font face="Verdana" size="2">
      <input type="checkbox" onclick="expand(this)" name="Subscribe2" value="Subscribe2" checked="checked" style="font-style: normal; font-variant: normal; font-weight: bold; font-size: 11px; font-family: Verdana, arial, sans-serif; height: 18; width:20">Please
      use my existing method of payment on file</font></form></td>
<div id="c2" class="switchcontent">
  </table>
  </div>
<td align="left">
&nbsp;</td>
&nbsp;</tr>
</table>
<table class="table-body" bgcolor="#ffffee" cellpadding="0" cellspacing="0" width="100%">
<tr>
      <td width="95">
      <form><font face="Verdana" size="2">
            </form></td>
      <td>
       <div id="C1" class="switchcontent">
            <table width="549" cellpadding="0" cellspacing="0" style="border: 0px dashed green;">
            <tr>
            <td style="padding-right: 50px; padding-bottom: 20px;">
            <p align="left">&nbsp;<p align="left"><font size="2">
<select name="Card" style="font-style: normal; font-variant: normal; font-weight: bold; font-family: Verdana, arial, sans-serif; height: 19; width: 182">
<option>--- Please select one ---</option>
<option selected value="Mastercard">Mastercard</option>
<option value="Visa">Visa</option>
<option value="Discover">Discover</option>
<option value="AMEX">AMEX</option>
</SELECT></font>&nbsp;&nbsp;&nbsp;

<font size="2">&nbsp; Card #:&nbsp;
<INPUT type="text" name="Name2" size="2" maxlength="35" style="font-style: normal; font-variant: normal; font-weight: bold; font-family: Verdana, arial, sans-serif; height: 21; width: 138; font-size:11px"></font>

 </td>
                  </tr>
            </table>
       </div>
</td>

--------------------------------------------------------------

Assistance is definitely appreciated!  Thank you in advance.

ChadStart Free Trial