title: Phonegap jQuery ajax call fails
body: <p>I know there a lot of questions about this already but I have yet to find one which actually helps.</p>
  
  <p>I'm using Phonegap to make an app which makes use of an in-house REST API for retrieving news items. I'm using jQuery 1.10.2 (and jQuery mobile 1.3.2 and mustache.js). Everything works fine when I test it on a local xampp server, it only stops working when compiled and deployed to a device.</p>
  
  <p>Here is my current <code>$.ajax</code> call (invoked on <code>deviceReady</code>):</p>
  
  <pre><code>$.support.cors = true;
  $.mobile.allowCrossDomainPages = true;
  
  // Load news items.
  $.mobile.loading("show");
  $.ajax({
      type: "GET",
      cache: false,
      url: "http://mynewsapi.com/items",
      dataType: "jsonp",
      timeout: 10000,  // 10 seconds
      error: function(xhr, status, exception){
          $("#msg").text("Error: "+status+" - "+exception);
          $.mobile.loading("hide");
      },
      success: function(data){
          $("#msg").text("Got JSONP response");
          console.debug(data);
          for (var i = 0; i &lt; data.items.length; i++) {
              data.items[i].image = data.imageHost+data.items[i].image;
              html = Mustache.render('&lt;li&gt;&lt;a href="#article?id={{id}}" data-transition="slidefade"&gt;&lt;img src="{{image}}" style="top:auto"&gt;&lt;h2&gt;{{title}}&lt;/h2&gt;&lt;/a&gt;&lt;/li&gt;', data.items[i]);
              $("#newsList").append(html);
              $("#newsList").listview("refresh");
          };
          $.mobile.loading("hide");
      }
  });
  </code></pre>
  
  <ul>
  <li>I have tried with and without setting <code>$.support.cors</code> and <code>$.mobile.allowCrossDomainPages</code></li>
  <li>In my config.xml I have <code>&lt;access origin="*" /&gt;</code></li>
  <li>I was originally using normal JSON but have more recently been trying JSONP to see if it would work any better (nope)</li>
  <li>The response from the server includes the <code>Access-Control-Allow-Origin: *</code> header</li>
  <li>Accessing the API URL in the device's browser works fine</li>
  </ul>
  
  <p>When using JSONP I get the error <code>parsererror - Error: jQueryxxx_xxx was not called</code> and when using normal JSON I would get <code>error - Unknown</code>.</p>
  
  <p>I have run out of things to try. Why isn't this working?</p>