I moved this script to a new design, and now it is not working

Here is the script from my original design:

In the head tag:

<script language="JavaScript" type="text/javascript">
<!--

var Opt1=[];
Opt1[0]=['Front Sideline','Front Sideline'];
Opt1[1]=['Front Hash','Front Hash'];
Opt1[2]=['Back Hash','Back Hash'];

var Opt2=[];
Opt2[0]=['Back Sideline','Back Sideline'];
Opt2[1]=['Front Hash','Front Hash'];
Opt2[2]=['Back Hash','Back Hash'];

var Opt3=[];
Opt3[0]=['Front Sideline','Front Sideline'];
Opt3[1]=['Back Sideline','Back Sideline'];
Opt3[2]=['Front Hash','Front Hash'];
Opt3[3]=['Back Hash','Back Hash'];

function Pop(id,ary){
var obj=document.getElementById(id);
obj.options.length=0;
for (var zxc0=0;zxc0<ary.length;zxc0++){
obj.options[zxc0]=new Option(ary[zxc0][0],ary[zxc0][1],true,true);
}
obj.selectedIndex=0;
}
//-->
</script>
</head>


Then the part in the body that uses this:
<input type="radio" name="AB" value="Above" onClick="Pop('Line',Opt1);">
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
<input type="radio" name="AB" value="Below" onClick="Pop('Line',Opt2);">
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
<input type="radio" name="AB" value="On" onClick="Pop('Line',Opt3);">
&nbsp;&nbsp;&nbsp;&nbsp;
<b>the</b>

<select name="Line" id="Line">
<option>Above, Below or On?</option>
</select>


Now in the new design:
In the head tag:

<script language="JavaScript" type="text/javascript">
<!--

var Opt1=[];
Opt1[0]=['Front Sideline','Front Sideline'];
Opt1[1]=['Front Hash','Front Hash'];
Opt1[2]=['Back Hash','Back Hash'];

var Opt2=[];
Opt2[0]=['Back Sideline','Back Sideline'];
Opt2[1]=['Front Hash','Front Hash'];
Opt2[2]=['Back Hash','Back Hash'];

var Opt3=[];
Opt3[0]=['Front Sideline','Front Sideline'];
Opt3[1]=['Back Sideline','Back Sideline'];
Opt3[2]=['Front Hash','Front Hash'];
Opt3[3]=['Back Hash','Back Hash'];

function Pop(id,ary){
var obj=document.getElementById(id);
obj.options.length=0;
for (var zxc0=0;zxc0<ary.length;zxc0++){
obj.options[zxc0]=new Option(ary[zxc0][0],ary[zxc0][1],true,true);
}
obj.selectedIndex=0;
}
//-->
</script>
</head>

Part in body that uses:
<input type="radio" name="AB" value="Above" onClick="Pop('Line',Opt1);">
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
<input type="radio" name="AB" value="Below" onClick="Pop('Line',Opt2);">
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
<input type="radio" name="AB" value="On" onClick="Pop('Line',Opt3);">
&nbsp;&nbsp;&nbsp;&nbsp;
<b>the</b>

<select name="Line" id="Line">
<option>Above, Below or On?</option>
</select>

In the new design, When I choose a radio button, instead of the new options being put in, it just makes the select box blank.

I just tested both scripts locally and they both work fine for me so I'm not sure what the problem is.