title: Setting the value of multiple inputs with the same id using jQuery?
body: <p>Considering the following HTML:</p>
  
  <pre><code>&lt;form id="upvoteForm" method="post" action="/post/upvote"&gt;
      &lt;input type="text" name="post_id" id="post_id"/&gt;
  &lt;/form&gt;
  &lt;form id="downvoteForm" method="post" action="/post/downvote"&gt;
      &lt;input type="text" name="post_id" id="post_id"/&gt;
  &lt;/form&gt;
  
  &lt;input type="hidden" id="_postid" value="1"/&gt;
  </code></pre>
  
  <p>I'm trying to set the two <code>input</code> fields with the name <code>post_id</code> to to value from <code>_postid</code> using this JavaScript and jQuery:</p>
  
  <pre><code>$(document).ready(function() {
      $('#post_id').val($('#_postid').val());
  });
  </code></pre>
  
  <p>However, as you can see <a href="http://jsfiddle.net/w5aa8/" rel="nofollow">in this jsFiddle</a>, it's only setting the value of the first one. How do I set the value of both of them? I thought the selector would end up grabbing both.</p>
  
  <p>Now, I realize you might be wondering why I have two forms on this page. The basic reason is I have <code>button</code> inputs that I've styled the way I want but then I use the <code>onclick</code> to call the <code>submit</code> of the appropriate form here. I am ultimately going to be leveraging AJAX here, but that's coming later.</p>