title: Guaranteeing asynchronous request callback order in Javascript
body: <p>In Javascript, I have two asychronous requests for data:</p>
  
  <pre><code>$.getJSON('http://foo.com', fooQuery, fooSuccess(data));
  $.getJSON('http://bar.com', barQuery, barSuccess(data));
  </code></pre>
  
  <p>and two callbacks to process the received data: </p>
  
  <pre><code>fooSuccess(data) { // Stuff }
  barSuccess(data) { // More Stuff }
  </code></pre>
  
  <p>How do I ensure barSuccess is executed only after fooSuccess completes? </p>
  
  <p>Notes: </p>
  
  <ul>
  <li>I want to keep the data requests as they are: asynchronous and non-blocking (since server responses may take a while). </li>
  <li>But, I want the callbacks that process the data to be executed sequentially. That is, I do not want to execute barSuccess until fooSuccess completes. </li>
  </ul>
  
  <p>Thanks so much for your wisdom and help!</p>