ทำ radiobox ให้เพิ่ม-ลด textbox ให้เขียนได้ตาม radiobox ที่กดครับ

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<table width="900" border="0" align="left" cellpadding="0" cellspacing="0">
     <tr><td align="left" width="100"><font color="#000000" size="-1"></font></td>
	<td align="left" width="800">
    <input name="reg" id="reg" type="radio" rel="NonMember"><font color="#000000" size="-1">ยังไม่เป็นสมาชิก</font> 
    <input name="reg" id="reg" type="radio" rel="Member" checked="checked" ><font color="#000000" size="-1">จากเว็บไซต์</font>
    <input name="reg" id="reg" type="radio" rel="Card"><font color="#000000" size="-1">จากบัตรสมาชิก</font> </td>
	</tr>
   <tr id="IdMember">
	<td align="left" width="100" height="20"></td>
	<td align="left" width="800"  height="20" id="tbName"><input name="password" id="password" type="text" class="tb1" autocomplete="off" placeholder="ใส่รหัสสมาชิก"></td>
	</tr>
    <tr>
	<td align="left" width="100" height="20"></td>
	<td align="left" width="800"  height="20"></td>
	</tr>
    <tr>
	<td align="left" width="100" height="20"></td>
	<td align="left" width="800"  height="20" id="tbName"><input name="address" id="address" type="text" class="tb1" autocomplete="off" placeholder="กรุณากรอกที่อยู่"></td>
	</tr>
     <tr>
	<td align="left" width="100" height="20"></td>
	<td align="left" width="800"  height="20"></td>
	</tr>
    <tr>
	<td align="left" width="100" height="20"></td>
	<td align="left" width="800"  height="20" id="tbName"><input name="name" id="name" type="text" class="tb1" autocomplete="off" placeholder="ชื่อเล่น"></td>
	</tr>
     <tr>
	<td align="left" width="100" height="20"></td>
	<td align="left" width="800"  height="20"></td>
	</tr>
    <tr>
	<td align="left" width="100" height="20"></td>
	<td align="left" width="800"  height="20" id="tbName"><input name="phone" id="phone" type="text" class="tb1" autocomplete="off" placeholder="เบอร์ติดต่อ"></td>
	</tr>
     <tr>
	<td align="left" width="100" height="20"></td>
	<td align="left" width="800"  height="20"></td>
	</tr>
    <tr>
	<td align="left" width="100" height="20"></td>
	<td align="left" width="800"  height="20" id="tbNamee"><input name="email" id="email" type="text" class="tb1" autocomplete="off" placeholder="อีเมล์ (ถ้ามี)"></td>
	</tr>
    <tr>
	<td align="left" width="100" height="20"></td>
	<td align="left" width="800"  height="20"></td>
	</tr>
    <tr>
	<td align="left" width="100" height="20"></td>
	<td align="left" width="800"  height="20" id="tbName"><input name="age" id="age" type="text" class="tb1" autocomplete="off" placeholder="อายุ"></td>
	</tr>
    <tr>
	<td align="left" width="100" height="20"></td>
	<td align="left" width="800"  height="20"></td>
	</tr>
    <tr>
	<td align="left" width="100" height="20"></td>
	<td align="left" width="800"  height="20" id="tbName"><input name="activity" id="activity" type="text" class="tb1" autocomplete="off" placeholder="รู้กิจกรรมมาจาก"></td>
	</tr>
    </table>
    <script src="bootstrap/js/jquery-1.10.2.min.js"></script>
    <script>
		$(function(){
			$(':radio').on('click',function(){
				var rel=$(this).attr('rel');
				$(':radio').each(function(index, element) {
                    $(this).prop('checked',false);
                });
				$(this).prop('checked',true);
				if(rel == 'NonMember'){
					$('#IdMember').hide();	
				}else{
					$('#IdMember').show();	
				}
			});
		});
	</script>