This jQuery page doesn't work, Why?
<p>why doesn't this jQuery code work ? what is wrong ?</p>

<p>The expected behavior that it alerts out the content of the requested JSON file but it doesn't.</p>

<pre><code>&lt;!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&gt; 
&lt;html xmlns="http://www.w3.org/1999/xhtml"&gt; 
&lt;meta http-equiv="Content-Type" content="text/html; charset=utf-8" /&gt; 
&lt;head&gt; 
&lt;script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"&gt;&lt;/script&gt; 
&lt;script type="text/javascript"&gt; 
$.ajax({
  type: 'GET',
  url: 'http://api.xxxxxxxxx.com/0.1/cities/key=xxxx',
  dataType: 'jsonp',
  crossDomain: true,
  success: function(data){
              $.each(data, function(i, el){
                    alert(el.city)
               });
         ;}
});
&lt;/script&gt; 

&lt;title&gt;Example&lt;/title&gt; 
&lt;/head&gt; 
&lt;body&gt;&lt;/body&gt; 
&lt;/html&gt;
</code></pre>
