Javascript-форум - Проблема radio button с кроссбраузерностью

Подскажите пожалуйста. Есть 3-и radio button, 3-и формы и соответственно обработчики этих radio button.

Первоначально все формы скрыты, мне необходимо по нажатию на первый radio button показать первую форму (2 и 3 формы не видны), по нажатию на второй - скрыть первую и показать вторую (1, 3-я форма не видна), по нажатию на 3 radio button скрыть 2 форму (1, 2 формы не видны).

По нажатию на radio button я вызываю обработкич событий javascript - onclick="show(1)". Для скрытия и отображения форм использую display:none и display:block соответственно.

Скрипт вроде как работает, но работает только на Chrome и на Safari, на IE (пробывал на 8 версии) и на FireFox (пробывал на 5 версии) - оно не работает.

Проверял тег input и событие onclick - пишут что поддерживается всеми браузерами на 100%.

Помогите пожалуйста разобраться, сидел-сидел - ничего не предумал, решил обратиться за помощью к профессионалам.

Заранее благодарен!

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 4.01 //EN" "http://www.w3.org/TR/xhtml4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />

    <script type="text/javascript" src="jquery.js" ></script>
	<script src="pack.js"></script>

<style>
#form1, #form2, #form3, #form4  {display:none;}
</style>

<!-- ------------------------------------------------- -->	

</head>
  <body>
  
  	<input type="radio" name="radio" onclick="show(1)"> 1
	<input type="radio" name="radio" onclick="show(2)"> 2
	<input type="radio" name="radio" onclick="show(3)"> 3

<!-- ------------------------------------------------- -->	

<form id="form1" action="send_email.php" method="post" enctype="multipart/form-data">

	<p class="type1">
	<select id="sel" size="1" name="width1">
	<option value="17">17</option>
	<option value="20">20</option>
	<option value="26">26</option>
	</select>	Ширина
	</p>
	
</form>	

<!-- ---------------- -   --- - - -  - -   - - - ----------------- -->	

<form id="form2" action="send_email.php" method="post" enctype="multipart/form-data">

	<p class="type2">
	<select id="heigh_2" size="1" name="height_2">
	<option value="35">35</option>
	<option value="40">40</option>
	<option value="45">45</option>
	</select>	Высота
	</p>
	
</form>	

<!-- ---------------- --- --- --  -  -   -   - - - --------------- -->	

<form id="form3" action="send_email.php" method="post" enctype="multipart/form-data">
	
	<p class="type3">
	<select id="shir_3" size="1" name="shir_3">
	<option value="30">30</option>
	<option value="40">40</option>
	<option value="50">50</option>
	</select>	Ширина
	</p>

<!-- ------------------------------------------------- -->

</form>	

  </body>
</html>

function show(num) {
         if(num == 1) {
		  $(".type1").css("display", "block");
		  $(".type2").css("display", "none");
		  $(".type3").css("display", "none");
		  $(".type4").css("display", "none");	  
		  $("#form1").css("display", "block");
		  $("#form2").css("display", "none");
		  $("#form3").css("display", "none");	
		  $("#form4").css("display", "none");			  
		 }
		 else if (num == 2) {
		  $(".type1").css("display", "none");
		  $(".type2").css("display", "block");
		  $(".type3").css("display", "none");
		  $(".type4").css("display", "none");		  
		  $("#form1").css("display", "none");
		  $("#form2").css("display", "block");
		  $("#form3").css("display", "none");	
		  $("#form4").css("display", "none");			  
         } 
		 else if (num == 3) {
		  $(".type1").css("display", "none");
		  $(".type2").css("display", "none");
		  $(".type3").css("display", "block");
		  $(".type4").css("display", "none");	  		  
		  $("#form1").css("display", "none");		  
		  $("#form2").css("display", "none");		  
		  $("#form3").css("display", "block");	
		  $("#form4").css("display", "none");		  
         }
 }