title: ajax request rely on the previous one
body: <p>I want to do something like this:</p>
  
  <pre><code>$.ajax({
    url: SOMEWHERE,
    ...
    success: function(data){
      // do sth...
      var new_url = data.url;
  
      $.ajax({
        url: new_url,
        success: function(data){
          var another_url = data.url;
  
          // ajax call rely on the result of previous one
          $.ajax({
             // do sth
          })
        }
      })
    },
    fail: function(){
      // do sth...
  
      // ajax call too
      $.ajax({
        // config
      })
    }
  })
  </code></pre>
  
  <p>the code looks awful for me.</p>
  
  <p>I wonder how to make it looks pretty. Some best practice?</p>