title: When binding with jQuery, DOM changes aren't reflected in real time
body: <p>I'm having a hard time understanding why I cannot update the DOM while jQuery is executing code. This isn't my actual scenareo, but I think it exemplfies the issue I'm having.</p>
  
  <p>I have a button called btnSubmit. When the user clicks it, I want to display a div element that tells the user some processing is happening. Here is the code:</p>
  
  <pre><code>$("#btnSubmit").bind("click",
      function () {
          $('#divProcessing').addClass('showProcessing');
          &lt;processing goes here&gt;
          debugger;
      });
  </code></pre>
  
  <p>The processing may or may not require an AJAX call. </p>
  
  <p>Here's my quandry: if I allow my script to break on the debugger statement, the page in the browser isn't updated. Its not updated until the script has finished running.</p>
  
  <p>I've seen many examples about how to do this (using .ajaxStart etc...), however none of them work for me. Any suggestions would be greatly appreciated!</p>