How a checkbox will trigger another input element in html via javascript?

Problem :

I have two input checkboxes as well as two text fields:

HTML:

<form action="">
  <label for="male">Male</label>
  <input onchange="genderCheck()" type="checkbox" checked="checked" name="sex" id="male" value="male"><br>
  <label for="female">Female</label>
  <input onchange="genderCheck()" type="checkbox" name="sex" id="female" value="female">

    <span id="spanIban">
    <br><label for="iban">IBAN:</label>
    <input type="text" name="mIban" id="iban">
  </span>
    <span id="spanBust"><br><label for="bust">Bust:</label>
      <input type="text" name="fBust" id="bust"></span>
</form>

I made the first checkbox checked by default as well as the first text field visible: CSS

#spanBust{visibility:hidden;}
#spanIban{visibility:visible;}

I would like it to do the following: When some of those checkboxes are triggered/untriggered the textareas below to do it as well (through visibility). Javascript:

var check = document.getElementById("male").defaultChecked;

function genderCheck(){
  if(document.getElementById("male").checked == true)
  {
 document.getElementById("spanIban").style.visibility="visible";
     document.getElementById("spanbBust").style.visibility="hidden";
}
  else if(document.getElementById("female").checked == true)
  {
 document.getElementById("spanIban").style.visibility="hidden";
 document.getElementById("spanBust").style.visibility="visible";
}
  else{  document.getElementById("spanIban").style.visibility="hidden";  document.getElementById("spanBust").style.visibility="hidden";}
}

I have done something wrong and have no idea how to clear up the things or rather the whole algorithm is wrong.

Solution :

You have a few typos in your code, otherwise it kinda works. You can help reduce these and also improve performance by stashing all your lookups in variables. The logic also does not seem quite right, you want the female checkbox only to toggle if the male is not checked? Anyway, here is a new version:

function GenderCheck(){
    var checkMale = document.getElementById("male"),
        checkFemale = document.getElementById("female"),
        iban = document.getElementById("spanIban"),
        bust = document.getElementById("spanBust");

    iban.style.visibility = (checkMale.checked ? "visible" : "hidden");
    bust.style.visibility = (checkFemale.checked ? "visible" : "hidden");

}

http://jsfiddle.net/bm2Nu/1/