title: alerting the value of an input type number
body: <p>Here is the code that I am having problems with. Below it I'll add an explanation:</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>$(function() {
   var $input = $("#input");
   var input = $input.val();
   var $go = $("#go");
  
   $go.click(function() {
    alert(input);
   });
  });</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"&gt;&lt;/script&gt;
  &lt;main&gt;
   &lt;input type="number" id="input"&gt;
   &lt;button type="button" id="go"&gt;GO!&lt;/button&gt;
  &lt;/main&gt;</code></pre>
  </div>
  </div>
  </p>
  
  <p>The code above is a dummie example to represent my actual question, no more background is needed.</p>
  
  <p>So I have one <code>input type="number" id="input"</code> in which you input a number, and a <code>button type="button" id="go"</code>.</p>
  
  <p>In my jQuery, I first declare <code>$input</code> which holds the element <code>#input</code>, then <code>input</code> which holds the value of the element <code>#input</code>, and finally <code>$go</code> which holds the element <code>#go</code>.</p>
  
  <p>Below that I have a function, that says that when I click on <code>#go</code>, I should be able to <code>alert(input)</code>.</p>
  
  <p>Now, this code does not do that. In my head this makes perfect sense, but apparently it doesn't work. </p>