title: Why isnt jQuery setting my value?
body: <p>So here is my code. I am trying to set the value of a hidden form input.</p>
  
  <pre><code>if($gender == "BOY" || $gender == "MALE" || $gender == "M" || $gender == "1") {
          console.log('Its a boy!');
          $(".girlsonly").hide();
          document.getElementsByName('dressjacket')[0].placeholder='Jacket';
          $('#majorgender').val('1');
      };
      if($gender == "GIRL" || $gender == "FEMALE" || $gender == "F" || $gender == "0") {
          console.log('Its a girl!');
          document.getElementsByName('dressjacket')[0].placeholder='Dress';
          $('#majorgender').val('0');
      };
  </code></pre>
  
  <p>Here is the form input:</p>
  
  <pre><code>&lt;input type="hidden" name="majorgender" id="majorgender"&gt;&lt;/input&gt;
  </code></pre>
  
  <p>It successfully logs "Its a girl!" or "Its a boy!" but afterwards when I insert "<code>alert($('majorgender').val());</code>" it alerts "<strong>undefined</strong>"</p>
  
  <p>If I log <code>alert($('majorgender'))</code> it replies with "object Object" so I know it exists, I just dont know why its not setting properly.</p>
  
  <p>Any thoughts?</p>