title: Detect if a field is updated with JavaScript or jQuery
body: <p>I have a very extensive template, and there is a form that updates the value of a text field with JavaScript or jQuery, this function has not been able to locate it, and I need to detect when this field is updated, I have tried with all these functions, but it is not detecting when it is updated.</p>
  
  <p>What is the reason why it is not detected when the field is updated from JavaScript but is detected when updated when I write and click outside the field?</p>
  
  <p><strong>Important:</strong> The value 90,000 "that is added dynamically, makes it a specific function, which I have not been able to find, and is to try to detect if the value changed with JavaScript.</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>$(function(){
  
  // Automatic update, strange function
  setTimeout(function(){
    // Value updated automatically
    $('#long').val("90.000");
  }, 2000);
  
  /**
   * Detect if that field is updated
   */
  $('input#long').on('change', function(){
    alert("Updated");
  });
  
  $(':input').on('change', function(){
    alert("Updated");
  });
  
  $('input#long').change(function(){
    alert("Updated");
  });
  
  $(document).on('change', 'input#long', function(){
    alert("Updated");
  });  
  
  $(document).on('change', 'input', function(){
    alert("Updated");
  }); 
  
  });</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" id="long"&gt;</code></pre>
  </div>
  </div>
  </p>