title: JSONP callback error: Property 'insertFilmData' of object [object Object] is not a function
body: <p>I Have 3 nested $.ajax calls using JSONP, the first $.ajax calls work in the function but the third fails to execute the call back giving me this error: <code>Uncaught TypeError: Property 'insertFilmData' of object [object Object] is not a function</code></p>
  
  <p>CODE:</p>
  
  <pre><code>function searchFilms(film, settings) {
  if (film === '') {
      console.log("enter a movie");
  } else {
      $.ajax({
          type: 'GET',
          url: 'http://api.themoviedb.org/3/configuration?api_key=XXX',
          async: false,
          jsonpCallback: 'getSearchResults',
          contentType: 'application/json',
          dataType: 'jsonp',
          success: function(json) {
              if (json.images) {
                  settings.imageData = json.images;
                  getSearchResults(json, settings);
              }
          }
      });
  
      function getSearchResults(data, settings) {
          $.ajax({
              type: 'GET',
              url: 'http://api.themoviedb.org/3/search/movie?api_key=XXX&amp;query=' + film,
              async: false,
              jsonpCallback: 'deliverResults',
              contentType: 'application/json',
              dataType: 'jsonp',
              success: function(json) {
                  if (json.total_results !== 0) {
                      deliverResults(json, settings);
                  }
              }
          });
  
          function deliverResults(data, settings) {
              var results = data.results;
              var html = "&lt;ul id='film-search-results' data-role='listview' data-inset='true'&gt;";
              for (var i = 0; i &lt; results.length; i++) {
                  var result = results[i];
                  var filmId = result.id;
                  $.ajax({
                      type: 'GET',
                      url: 'http://api.themoviedb.org/3/movie/' + filmId + '?api_key=XXX&amp;append_to_response=' + settings.extras,
                      async: false,
                      jsonpCallback: 'insertFilmData',
                      contentType: 'application/json',
                      dataType: 'jsonp',
                      success: function(json) {
                          if (json) {
                              settings.html = html;
                              insertFilmData(json, settings);
                          }
                      }
                  });
  
                  function insertFilmData(data, settings) {
                      var poster_base_url = settings.imageData.base_url;
                      var poster_size = settings.imageData.poster_sizes[0];
                      var poster_filepath = data.poster_path;
                      var poster_url = poster_base_url + poster_size + "/" + poster_filepath;
                      var html = settings.html + "&lt;li&gt;&lt;img src='" + poster_url + "' alt='Poster' /&gt;&lt;a  class='ui-link-inherit'&gt;&lt;h3 class='ui-li-heading'&gt;" + data.title + "&lt;/h3&gt;&lt;p class='ui-li-desc'&gt;&lt;strong&gt;" + data.tagline + "&lt;/strong&gt;&lt;/p&gt;&lt;p class='ui-li-desc'&gt;" + data.overview + "&lt;/p&gt;&lt;/a&gt;&lt;/li&gt;";
  
                  }
              }
              html = html + "&lt;/ul&gt;";
              console.log(html);
              $('#content-add-title').html(html);
              $('#film-search-results').trigger("create");
          }
      }
  }
  }
  </code></pre>
  
  <p>I'm pretty new to using JSONP for cross domain calls so i'm not sure what's going wrong seeing as the first two call backs fire and it's only the last one that doesn't. any help or direction would be greatly appreciated. Thanks</p>