Javascript: Image not matching value of radio button
<p>I am working with radio buttons and displaying an image depending on the radio button chosen. But somehow I am receiving an error with the image array. I only get two pictures displayed and does not match the proper value. Is the error in my array or the html? <a href="http://webprolearner2346.zxq.net/bike_calculator/" rel="nofollow">EXAMPLE</a> </p>

<p>Reference of bikes:</p>

<ul>
<li><a href="http://gear.dirtrider.com/2011-kawasaki-kx-450f.html" rel="nofollow">Bike1.jpg</a></li>
<li><a href="http://www.motorcyclecruiser.com/2010/yamaha/road_star/s/54875/05/" rel="nofollow">Bike2.jpg</a></li>
<li><a href="http://www.motorcyclistonline.com/2010/aprilia/rsv4/r/55445/05/" rel="nofollow">Bike3.jpg</a></li>
</ul>

<p><strong>JS</strong></p>

<pre><code>&lt;script&gt;
 function check_value(val) { 
       var imgs = ['images/bike1.jpg', 'images/bike2.jpg', 'images/bike3.jpg'];
       var img = imgs[val];
       var el = document.getElementById("imgBox");
       if (img) {
         el.src = img;
         el.style.display = "";
       }

     }
&lt;/script&gt;
</code></pre>

<p><strong>HTML</strong></p>

<pre><code>&lt;form name="builder"&gt;
   &lt;input type="radio" name="field" value="1" onclick='check_value(1)'/&gt; KAWASAKI KX 450F&lt;br /&gt;
   &lt;input type="radio" name="field" value="2" onclick='check_value(2)'/&gt; 2010 Yamaha Road Star S&lt;br /&gt;
   &lt;input type="radio" name="field" value="3" onclick='check_value(3)'/&gt; Aprilia RSV4&lt;br /&gt;
&lt;/form&gt;

&lt;img id="imgBox" src="#" style="display:none"&gt;
</code></pre>
