title: JavaScript onchange update variable as soon as text value input changes
body: <p>I have a function that inserts a value into a hidden input. As soon as the input value changes because of my function I would like a variable to update.</p>
  
  <p>I keep running into a couple errors. Either I get <code>Object Object</code> as a response when I check the variable or the variable doesn't update unless I manually type in a value in the input then click out of the box.</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>var name = $('#name');
  
  function updateVariable(nameTwo) {
    name = nameTwo;
  }
  
  setTimeout(function() {
    $('#name').val('John');
  }, 1000);
  
  $('button').click(function() {
    $('#test').text(name);
  });</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;input type="text" name="name" id="name" onchange="updateVariable(this.value)" /&gt;
  
  &lt;h1 id="test"&gt;&lt;/h1&gt;
  &lt;button&gt;Test&lt;/button&gt;</code></pre>
  </div>
  </div>
  </p>