title: Wait a few ajax finished, but the ajax function is dynamically called
body: <p>I want to wait a few ajax finished.
  I have checked some pages and get the ideas of </p>
  
  <p><code>$.when ().done(funciton(){})....</code></p>
  
  <p>However in my case is little bit complex.
  ajax is dynamically generated and, it is the method of the Class.</p>
  
  <pre><code>class TestClass{
      constructor(){} 
      myAjax = function(id){
          $.ajax({
              url:  myajax,
              type: 'POST',dataType: 'json',
              data: {"id" : id},
              success: function(data) {
                  console.log("byId loaded:"+ id);
              }
          });
      }
  }
  testclass = new TestClass();
  var myIds = [1,3,5,7];
  for (var i in myIds) {
      testclass.myAjax(myIds[i]); // I want to wait every ajax is finished.
  }
  </code></pre>
  
  <p>I have tried like this using $.when() but in vain (compile error)</p>
  
  <pre><code>$.when(
  for (var i in myIds) {
      testclass.callGraph(myIds[i]); .
  
  ).done(function(){
      console.log("load finished");
  }
  </code></pre>