title: On button click, select a sibling element with JQuery
body: <p>I have this code:</p>
  
  <pre><code>&lt;div class="item"&gt;
    &lt;div class="hidden"&gt;44&lt;/div&gt;
    &lt;input type="submit" id="btnAddCommentForAnswer" value="Add Comment" /&gt;
    &lt;script type="text/javascript"&gt;
      $(document).ready(function () {
          $('#btnAddCommentForAnswer').click(function () {
              alert(XXX);
          });
  
      });
    &lt;/script&gt;    
  &lt;/div&gt;
  
  &lt;div class="item"&gt;
    &lt;div class="hidden"&gt;12&lt;/div&gt;
    &lt;input type="submit" id="btnAddCommentForAnswer" value="Add Comment" /&gt;
    &lt;script type="text/javascript"&gt;
      $(document).ready(function () {
          $('#btnAddCommentForAnswer').click(function () {
              alert(XXX)
          });
  
      });
    &lt;/script&gt;  
  &lt;/div&gt;
  </code></pre>
  
  <p>what code should I put at XXX to get the content of the div with class=hidden when i press the  button at the same div with class=item?
  <br />
  If you click the first button you should get 44, and for clicking the second button you get 12.</p>