title: Getting sibling text input value
body: <p>I have the following HTML</p>
  
  <pre><code>           &lt;li class='user_attributes'&gt;&lt;b&gt;username: &lt;/b&gt;{{username}}
                  &lt;input class='user_input form-control edit_fields {{_id}}' id='username_field' type="text" name='username' placeholder="username"&gt;
                  &lt;button type="submit" class="btn btn-default submit_button edit_fields {{_id}}" id='update_username'&gt;update&lt;/button&gt;
            &lt;/li&gt;
  </code></pre>
  
  <p>And I'd like to get the value of the input field whenever that <code>&lt;li&gt;</code>'s submit button is clicked (not the value of other input fields with the same name).</p>
  
  <p>I have the following jQuery, but all of it returns undefined:</p>
  
  <pre><code>    'click #update_username': function(ev, template){
          ev.preventDefault();
  
          // var username_field = template.$('input[id="username_field"]').val();
  
          // var username_field = $(ev.target).find('[name = message]').val();
  
          var input_field = $(this).siblings($('input[id="username_field"]')).val();
  
          console.log(input_field);
  
          // Meteor.call('updateUsername', this._id, username_field);
  
      }
  </code></pre>
  
  <p><strong>EDIT</strong></p>
  
  <p>this is an issue of the framework Im using (Meteor.js) and the scope of 'this' </p>