title: Change a for loop to execute functions on one row at a time
body: <p>I have a function that is to run through each row of a table, grab the number from that cell, send that number to a url to fetch a json response, then print something based on that.  I almost have it working but as it is now it is just dumping these all out at once, I want it to use something like <code>.each</code> to go through each row, do its stuff then move to the next.  I am also working with jquery datatables.  The script is like this :</p>
  
  <pre><code>$j('#imageCheck').click(function(){
      var cells = [];
      var rows = oTable.fnGetNodes();
      for( var i=0;i&lt;rows.length;i++){
          grabsku = $j(rows[i]).find('td:eq(2)').text();
          imgreplace = $j(rows[i]).find('td:eq(2)');
          s7url = 'http://checkit.com/is/image/' + grabsku;       
  
          $j.ajax({
              type: 'GET',
              url: s7url,
              data: 'req=exists,json',
              dataType: 'jsonp',
              beforeSend:function(){
                  imgreplace.html('checking ..');
              },
              success: function(){
                  imgreplace.html(z);
              }
          });
      }
  });
  </code></pre>
  
  <p>The response and everything works fine, my question is how to loop these one by one. So as in this example the <code>imgreplace.html('checking ..');</code> happens simultaneously through every row in the table.  I want it to just process that one row and after <code>success</code> move on to the next.</p>
  
  <h2>Update</h2>
  
  <p>To better explain why I am doing it this way, I agree it is unnatural, the data I grabbing from each cell helps form a unique url, <code>s7url</code>.  Each of these returns a response like this from a server I have no control over: </p>
  
  <pre><code>s7jsonResponse(
  {"catalogRecord.exists":"0"},"");
  </code></pre>
  
  <p>I then do something with knowing if true or false like this :</p>
  
  <pre><code>function jsonResponse(response){    
      x = response["record.exists"];  
      z = x == "0" ? "NO" : "YES";
  }
  </code></pre>
  
  <p>I like scrappedcola's solution but it led me to discover that the success is never being fired.  I am not sure why that is.  I can see in the inspector tab that there is a response like I pasted above.  I tried to move the success into its own function, something like :</p>
  
  <pre><code>success: function(){ success(); } 
  
  ...
  
  var success = function(){
      imgreplace.html(z);
      i++;
      handleImageCheck(i);    
  }
  </code></pre>
  
  <p>but that didnt help..   </p>
  
  <h2>Update 2</h2>
  
  <p>So I gave up trying to put the variables into success.  Instead I will share with you my very ugly hack.  On success of the error response, ick.</p>
  
  <pre><code>error: function(data, status){
          if (status = "parseerror") {
              imgreplace.html(z);
              i++;
              handleImageCheck(i);    
          }
      }
  </code></pre>
  
  <h2>Update 3</h2>
  
  <p>If for some reason anybody cares, I found the solution for my other problem of <code>success</code> not firing.  I needed to add <code>jsonpCallback</code> to the options and then process the response as a function in the <code>succcess</code>.</p>