title: Google Maps adding marker from ajax using jquery
body: <p>I am trying to add google maps to my web page, the web page has div with id of radar with width specified. I get coordinates from a second page using jquery ajax method, and plot them on the map using Marker. But only the last marker is displayed nothing else is displayed.</p>
  
  <pre><code>var global = new Array();
          $(document).ready(function () {
  
              console.log("ready!");
              if ($("#StartingDate").val() != "") {
                  var start = $("#StartingDate").val();
                  var end = $("#EndingDate").val();
                  var id = $("#UserId").val();
  
                  $.ajax({
                      url: "GetData.aspx?StartingDate=" + start + "&amp;EndingDate=" + end + "&amp;UserId=" + id, async: false, success: function (result) {
                          var resp = result.split(",");
                          for (x = 0; x &lt; resp.length - 1; x++) {
                              var cor = resp[x].split(";");
                              var lat = cor[0];
                              var lon = cor[1];
                              var date = cor[2]
                              var temp = [lat, lon, date];
                              global.push(temp);
                          }
                      }
                  });
              }
  
  
          });
          $(document).ajaxComplete(function () {
  
              var myLatlng = new google.maps.LatLng(-25.363882, 131.044922);
              var mapOptions = {
                  zoom: 4,
                  center: myLatlng
              }
              var map = new google.maps.Map(document.getElementById("radar"), mapOptions);
              for (var i = 0; i &lt; global.length; i++) {
                  console.log(global[i]);
                  var marker =  new google.maps.Marker({
                      position: new google.maps.LatLng(parseFloat(global[i][0]),parseFloat(global[i][1])),
                      title: global[i][2]
                  });
  
                  marker.setMap(map);
              }
  
          });
  </code></pre>
  
  <p>After the ajax call succeeds my variable named global is filled like this:</p>
  
  <pre><code>global = [
   [
     0: "33.622835",
     1: "73.062932",
     2: "16/06/2015 1:17:24 AM"
   ],....
  ]; 
  </code></pre>