title: Multiple asynchronous Ajax calls inside each loop in Jquery
body: <p>I want to call multiple APIs inside a loop (ex: $.each). I can do this with <code>async:false</code> mode but it makes the script lag. How to achieve this in synchronized mode? Just ignoring <code>async</code> option makes only the last element in <code>list</code> to be sent to api calls. </p>
  
  <pre><code>$.each(lists, function(index, value) {
  
              channel = lists[index].channel;
              list = lists[index].list;
  
              $.ajax({
                  url : 'api.php?list=' + list + '&amp;from=' + from + '&amp;to=' + to,
                  dataType : 'json',
                  async : false,
                  success : function(data) {
                      obj = data;
  
                      $.ajax({
                          url : 'api.php?list=' + list + '&amp;from=' + from + '&amp;to=' + to + '&amp;action=sender',
                          dataType : 'json',
                          async : false,
                          success : function(data) {
  
                              obj['senders'] = data.msg;
                              CommonContainer.inlineClient.publish(channel, obj);
  
                          }
                      });
  
                  }
              });
  
          });
  </code></pre>