title: How to get multiple selected radio buttons value using Jquery
body: <p>I want to get multiple radio buttons value using Jquery. But now could only get the first one's value.</p>
  
  <pre><code>&lt;form action="get" method="post"&gt;
                      &lt;table width="100%"&gt;
                      &lt;tbody id="checklistwrapper"&gt;
  
                      &lt;tr class="checklisttr" id="1"&gt;
  
                      &lt;td align="left" width="40%"&gt;&lt;br&gt;
                      &lt;label for="veryiii" style="align:left;"&gt;Within your circle of competence?&lt;/label&gt;
                      &lt;/td&gt;
  
                      &lt;td align="center"&gt;
                      &lt;label for="veryi" width="12%"&gt;Worst&lt;/label&gt;&lt;br&gt;&lt;br&gt;
                      &lt;input type="radio" id="veryi" value="5.0" name="circle"&gt;
                      &lt;/td&gt;
  
                      &lt;td align="center" width="12%"&gt;&lt;br&gt;&lt;br&gt;
                      &lt;input type="radio" id="vii" value="4.5" name="circle"&gt;
                      &lt;/td&gt;
  
                      &lt;td align="center" width="12%"&gt;
                      &lt;label for="veryiii"&gt;Neutral&lt;/label&gt;&lt;br&gt;&lt;br&gt;
                      &lt;input type="radio" id="veryiii" value="3.0" name="circle"&gt; 
                      &lt;/td&gt;
  
                      &lt;td align="center" width="12%"&gt;&lt;br&gt;&lt;br&gt;
                      &lt;input type="radio" id="viv" value="1.5" name="circle"&gt;
                      &lt;/td&gt;
  
                      &lt;td align="center" width="12%"&gt;
                      &lt;label for="veryv"&gt;Best&lt;/label&gt;&lt;br&gt;&lt;br&gt;
                      &lt;input type="radio" id="veryv" value="1.0" name="circle"&gt;
                      &lt;/td&gt;
                      &lt;/tr&gt;
  
                      &lt;tr class="checklisttr" id="2"&gt;
  
                      &lt;td align="left" width="40%"&gt;&lt;br&gt;
                      &lt;label for="veryiii" style="align:left;"&gt;Macro economic environment favorable?&lt;/label&gt;
                      &lt;/td&gt;
  
                      &lt;td align="center" width="12%"&gt;&lt;br&gt;
                      &lt;input type="radio" id="veryi" value="5.0" name="macro"&gt;
                      &lt;/td&gt;
  
                      &lt;td align="center" width="12%"&gt;&lt;br&gt;
                      &lt;input type="radio" id="vii" value="4.5" name="macro"&gt;
                      &lt;/td&gt;
  
                      &lt;td align="center" width="12%"&gt;&lt;br&gt;
                      &lt;input type="radio" id="veryiii" value="3.0" name="macro"&gt; 
                      &lt;/td&gt;
  
                      &lt;td align="center" width="12%"&gt;&lt;br&gt;
                      &lt;input type="radio" id="viv" value="1.5" name="macro"&gt;
                      &lt;/td&gt;
  
                      &lt;td align="center" width="12%"&gt;&lt;br&gt;
                      &lt;input type="radio" id="veryv" value="1.0" name="macro"&gt;
                      &lt;/td&gt;
                      &lt;/tr&gt;
  
                      &lt;/tbody&gt;&lt;/table&gt;
  
                      &lt;div style="float:right;margin-top:10px;margin-bottom:5px;"&gt;
                          &lt;button type="button" id="savechecklist"&gt;Save Checklist&lt;/button&gt;
                      &lt;/div&gt;
  </code></pre>
  
  <p></p>
  
  <pre><code>    $('#savechecklist').click(function(){
      var the_value;
      //the_value = jQuery('input:radio:checked').val();
      //the_value = jQuery('input[name=macro]:radio:checked').val();
      the_value = getChecklistItems();
      //alert(the_value);
  });
  
  function getChecklistItems() {
      var columns = [];
  
      $('tr.checklisttr').each(function() {
          //columns.push($(this).('input:radio:checked').val());
          //the_value = $(this).('input:radio:checked').val();
          var the_value = jQuery('input:radio:checked').attr('id');
          alert(the_value);
      });
  
      return columns.join('|');
  }
  </code></pre>