javascript - Show and hide form no working propery with IE -

i have simple js script shows , hide 2 forms variants.

function show_form (item_form_id, item_desc_id, radio_item_id) {  /* hide active */  var i=0;  (; < document.getelementsbyclassname('active').length; i++ ) {      active_item=document.getelementsbyclassname('active')[i].style.display='none';      }    /* show unactive */  var a=0;  (; < document.getelementsbyclassname('unactive').length; a++ ) {      unactive_item=document.getelementsbyclassname('unactive')[a].style.display='block';      }    form_id=document.getelementbyid(item_form_id);  form_id.style.display='block';    desc_id=document.getelementbyid(item_desc_id);  desc_id.style.display='none';    radio_id=document.getelementbyid(radio_item_id);  radio_id.checked=true;  }

.active {  display:none;  }

<table border="0" cellspacing="2" cellpadding="2">  <tr onclick="show_form('form_1','form_1_unactive','radio_item_1');">      <td><div class="active" id="form_1"><input type="text" id="name" name="name" value="text 1"></div><div class="unactive" id="form_1_unactive">form_1</div></td>      <td><input type="radio" name="address_id" value="radio_1" id="radio_item_1"></td>  </tr>  <tr onclick="show_form('form_2','form_2_unactive','radio_item_2');">      <td><div class="active" id="form_2"><input type="text" id="name" name="name" value="text 2"></div><div class="unactive" id="form_2_unactive">form_2</div></td>      <td><input type="radio" name="address_id" value="radio_2" id="radio_item_2"></td>  </tr></table>

it works ff, chrome, opera doesn't work in ie. after select 1 form can't put characters - cursor disapears.

i've tryed css visibility , same - no cursor. how fix or make in different way - show , hide forms ?