title: JQuery function doesn't print out anything
body: <p>I'm trying to let it work this jquery function but without any results. Here is it. It receive from setmap (a servlet) a list formatted in json. I'm totally sure I get the list but unfortunately I don't see the map appearing in the screen.</p>
  
  <pre><code>$(document).ready(function(){
  
      $("#airports").click(function(){
  
          $.getJSON('setmap', function(list) {       
  
              var mapOptions = {
                  zoom: 2,
                  mapTypeId: new google.maps.MapTypeId.TERRAIN
              };
  
              $('.grid_12').append($("&lt;div id='mapCanvas'&gt;&lt;/div&gt;"));
  
              var map = new google.maps.Map(mapCanvas, mapOptions);  
  
              if(list.length &gt; 0)
              {
                  for (var i = 0; i &lt; list.length; i++) 
                  {
                      var latLng = new google.maps.LatLng(list[i].latitude,list[i].longitude);
                      var marker = new google.maps.Marker({
                          position: latLng,
                          map: map
                      });
                  }    
              } 
  
          });
  
      });
  });
  </code></pre>
  
  <p>HTML</p>
  
  <pre><code>&lt;article&gt;
    &lt;section class="grid_12"&gt;&lt;/section&gt;
  &lt;/article&gt;
  </code></pre>