document is null or not an object error(radio buttons)

[jogurt]

Hello everyone!

Ive done many searches and still am unable to figure out my current problem ><

Im validating a group of radio buttons to see if they are checked or not and depending on which radio button in the group is checked, a different image is selected.

The problem is on IE(on FF it works fine), the error it gives me is:

Error:'document.formButton.button_url.0' is null or not an object'

here is the following JS and form (ive cut some of the code out that is unrelated for easier reading):

<script type="text/javascript">
function printBuyButton() {
	if(document.formButton.button_url[0].checked) {
		l_image_name = "http://www.example.com/buttons/buy_ca_1_EN.jpg";
	} else if(document.formButton.button_url[1].checked) {
		l_image_name = "http://www.example.com/buttons/buy_ca_2_EN.jpg";
	} else if(document.formButton.button_url[2].checked) {
        l_image_name = "http://www.example.com/buttons/buy_ca_1_FR.jpg";
    } else if(document.formButton.button_url[3].checked) {
        l_image_name = "http://www.example.com/buttons/buy_ca_2_FR.jpg";
    } 
}

...
...
</script>

<form name=\"formButton\" id=\"formButton\" onsubmit=\"return false\">
<table class=\"signup\">									<tfoot>
<tr>
	<td colspan=\"2\"><input id=\"create\" type=\"submit\" name=\"create\" value=\"Create Button\" onClick=\"javascript:printBuyButton();\"></td>
										</tr>
									</tfoot>

<td class="smallBody" width="25%"><img src="https://www.example.com/buttons/buy_ca_1_EN.jpg"  ><br>
				<input type="radio" name="button_url" value="http://www.example.com/buttons/buy_ca_1_EN.jpg" checked> &nbsp;&nbsp;</td>

			<td width="25%"><img src="https://www.example.com/buttons/buy_ca_2_EN.jpg"><br>
			<input type="radio" name="button_url" value="http://www.example.com/buttons/buy_ca_2_EN.jpg"> &nbsp;</td>
		</tr>

		<tr align="center" valign="middle" bgcolor="white">
		<td class="smallBody" width="25%"><img src="https://www.example.com/buttons/buy_ca_1_FR.jpg" ><br>
		<input type="radio" name="button_url" value="http://www.example.com/buttons/buy_ca_1_FR.jpg" > &nbsp;&nbsp;</td>

		<td width="25%"><img src="https://www.example.com/buttons/buy_ca_2_FR.jpg"><br>
		<input type="radio" name="button_url" value="http://www.example.com/buttons/buy_ca_2_FR.jpg"> &nbsp;</td>
		
		</tr>

		<tr bgcolor="white">
			<td class="smallBody" colspan="4">
				<p>Or customize your button! Just enter the exact URL of any image on your website.</p>
				<p><input type="radio" name="button_url" value="custom"> Yes, I would like to use my own image</p>
				<p>Button Image URL: <input id="button_custom_url" type="text" name="button_custom_url" value="http://" size="60"></p>
			</td>
		</tr>
</table></form></center>";

Any thoughts as to what may be the problem?

[jogurt]

friendly bump