I cannot get the different values from radio buttons using jquery ajax
<p>my form </p>

<pre><code>&lt;form action="" method="post"&gt;

&lt;p&gt;Shirt 1 : &lt;input type="radio" name="myradio" id="myradio" value="0"/&gt;&lt;/p&gt;
&lt;p&gt;Shirt 2 : &lt;input type="radio" name="myradio" id="myradio"  value="1"/&gt;&lt;/p&gt;


&lt;input type="button" name="submit" id="submit" value="create" onclick="createImage()" /&gt;

&lt;/form&gt;
</code></pre>

<p>my javascript:</p>

<pre><code>function createImage(){

     $.ajax({


        type: "POST",
        url: "output.php",
        data:   "myradio=" + document.getElementById("myradio").value,
        success: function(html){
            $("#output").html(html);
        }   


     });
}
</code></pre>

<p>for <code>$_POST['myradio']</code> I'm only getting the value of 0 even if I click the 2nd radio button. Do I need to give the radio buttons different id's?</p>
