title: Breaking for loop inside ajax response
body: <p>Okey i am making progress bar for sent messages! I need to break out of foor loop inside ajax request response! Here is the code:</p>
  
  <pre><code>var breakFlag = false;
  loop:
  for (var i = 0; i &lt; count; ++i) {
      name = userArr[i]['fName'];
      surname = userArr[i]['lName'];
      phone = userArr[i]['phone'];
      counter = i;
      $.ajax({
          type: "POST",
          url: HTTPS + '/lib/model/data/ctlSms.php?send=1',
          data: {
              smsMessage: $("#smsMessage").val(),
              smsClient: $("#smsClient").val(),
              number: $("#number").val(),
              throttle: $("#throttle").val(),
              userPhone: phone,
              fName: name,
              lName: surname,
              counter: counter
          },
          dataType: 'json',
          success: function(info) {
              if (info['results'] == "success") {
                  if (start) {
                      $("#progress").width(progress);
                      $("#messageArea").append(info['info']);
                      start = false;
                  } else {
                      tempPr = $("#progress").width() + progress;
                      $("#messageArea").append(info['info']);
                      $("#progress").width(tempPr);
                  }
              } else {
                  failed++;
                  if (start) {
                      $("#progress").width(progress);
                      $("#messageArea").append(info['info']);
                      start = false;
                  } else {
                      tempPr = $("#progress").width() + progress;
                      $("#messageArea").append(info['info']);
                      $("#progress").width(tempPr);
                  }
              }
              if ((parseInt(info['counter'])) == count) {
                  var success = count - failed;
                  $("#messageArea").append("&lt;span&gt;Total of " + count + " messages serviced!&lt;/span&gt;&lt;br&gt;&lt;span style='color:green'&gt;Sucessful: " + success + "&lt;/span&gt;&lt;br&gt;&lt;span style='color:red'&gt;Failed: " + failed + "&lt;/span&gt;&lt;br&gt;");
              } else if (failed == $("#maxFail").val() &amp;&amp; $("#maxFail") != "") {
                  var tempCount = info['counter'] + 1;
                  $("#messageArea").append("&lt;span&gt;Total of " + tempCount + " messages serviced!&lt;/span&gt;&lt;br&gt;&lt;span style='color:red'&gt;Max failes: " + failed + " reached!&lt;/span&gt;&lt;br&gt;");
                  breakFlag = true;
              }
          },
          error: function() {
              $("#messageArea").append("&lt;span&gt;Ajax error with &lt;/span&gt;&lt;br&gt;");
          }
      });
      console.log(breakFlag);
      if (breakFlag) {
          console.log("break");
          break loop;
      }
  }
  </code></pre>
  
  <p>Okey so i set global var breakFlag to false, and if maximum allowed fails is met, than breakFlag is set to true inside ajax response, and before for loop cycle ends, i check if this flag is set to true... Okey i console loges after setting to true, it says true, but when i check outside response bfore end of cycle its again false, and next xyxle begins??? Why is this happening?</p>