title: Why does val() returns undefined?
body: <p>i try to get the value of the next hidden input field when a button is clicked but my script always returns "undefined". What am i doing wrong and why does val() returns undefined? If only try to select the element with next('input:hidden') the function returns an object.</p>
  
  <pre><code>        &lt;div class="row-fluid"&gt;
              &lt;div class="span12"&gt;
                  &lt;div class="message-ratebox"&gt;
                      &lt;ul class="unstyled inline"&gt;
                          &lt;li&gt;
                              &lt;button class="rating-button" id="rating-first" value="1"&gt;
                                  Er will dich
                              &lt;/button&gt;1
                          &lt;/li&gt;
                          &lt;li&gt;
                              &lt;button class="rating-button" id="rating-second" value="2"&gt;
                                  Er will dich nicht
                              &lt;/button&gt;5
                          &lt;/li&gt;
                          &lt;li&gt;
                              &lt;button class="rating-button" id="rating-third" value="3"&gt;
                                  Es ist alles offen
                              &lt;/button&gt;2
                          &lt;/li&gt;
                      &lt;/ul&gt;
                      &lt;input type="hidden" name="target_message_id" value="1" /&gt;
                  &lt;/div&gt;
              &lt;/div&gt;
          &lt;/div&gt;
          &lt;div class="row-fluid"&gt;
              &lt;div class="span12"&gt;
                  &lt;div class="message-ratebox"&gt;
                      &lt;ul class="unstyled inline"&gt;
                          &lt;li&gt;
                              &lt;button class="rating-button" id="rating-first" value="1"&gt;
                                  Er will dich
                              &lt;/button&gt;1
                          &lt;/li&gt;
                          &lt;li&gt;
                              &lt;button class="rating-button" id="rating-second" value="2"&gt;
                                  Er will dich nicht
                              &lt;/button&gt;5
                          &lt;/li&gt;
                          &lt;li&gt;
                              &lt;button class="rating-button" id="rating-third" value="3"&gt;
                                  Es ist alles offen
                              &lt;/button&gt;2
                          &lt;/li&gt;
                      &lt;/ul&gt;
                      &lt;input type="hidden" name="target_message_id" value="2" /&gt;
                  &lt;/div&gt;
              &lt;/div&gt;
          &lt;/div&gt;
  </code></pre>
  
  <p><em>JavaScript:</em></p>
  
  <pre><code>$(document).ready(function() {
      $('button.rating-button').click(function(event) {
          event.preventDefault();
          var $rating = $(this).attr('value');
          var $messageId = $(this).next('input:hidden').val();
  
          alert('test'+$messageId);
      });
  });
  </code></pre>