title: How to set up an array in order to get radio button values without using jQuery
body: <p>I am having trouble setting up an array in order to get the value of the radio buttons. These are the radio buttons that I have in my form:
  </p>
  
  <pre><code>&lt;form name="artistImages"&gt; //This is the form tag 
  </code></pre>
  
  
  
  <pre class="lang-html prettyprint-override"><code>&lt;legend&gt; Gallery &lt;/legend&gt;
           &lt;input type="radio" name="artist" value="Z"&gt;&lt;img src="zedd.png" height="82" width="68"&gt;
           &lt;input type="radio" name="artist" value="T"&gt;&lt;img src="taylorswift.jpg" height="82" width="68"&gt;
           &lt;input type="radio" name="artist" value="P"&gt;&lt;img src="pharrell.jpg" height="82" width="68"&gt;
           &lt;input type="radio" name="artist" value="B"&gt;&lt;img src="beyonce.jpg" height="82" width="68"&gt;
           &lt;input type="radio" name="artist" value="D"&gt;&lt;img src="drake.jpg" height="82" width="68"&gt;
           &lt;input type="radio" name="artist" value="E"&gt;&lt;img src="eminem.jpg" height="82" width="68"&gt;
           &lt;input type="button" id="mybutton" value="GetValue" onClick="getRadioValue(radioArray)"/&gt;&lt;br&gt;
  
  &lt;input id="image" type="text" name="name" size="20"&gt;
  </code></pre>
  
  <p>and this is the javascript</p>
  
  
  
  <pre class="lang-js prettyprint-override"><code>&lt;script&gt;
  var radioArray = [document.forms.artistImages.artist];
  function getRadioValue(radioArray){
  var i
  var text = document.getElementById('image').value;
  
  for (i = 0; i &lt; radioArray.length; i++){
      if(radioArray[i].checked) return radioArray[i].value;
      var text = radioArray[i].value;
      };
      };  
  &lt;/script&gt;
  </code></pre>