CORS localhost ajax request I have an HTML page (http://localhost:8888/test/test.html) in which I'm trying to pull data from a Drupal 7 website.

I'm using this AJAX code with HTML-Request. I have tried JSON and the website prevents me from pulling, even I have added the following code to pull the data.

&lt;?php header('Access-Control-Allow-Origin: *'); ?&gt;


This is the HTML page that requests AJAX from Drupal 7 website. Could you please check it for me?

&lt;script src="http://code.jquery.com/jquery-latest.js"&gt;&lt;/script&gt;
&lt;script&gt;
  (function ($) {
    $(document).ready(function () {
      $.ajax({
        // The link we are accessing.
        url: "http://horizon-websolutions.com",
        // The type of request.
        type: "get",
        // The type of data that is getting returned.
        dataType: "html",
        error: function () {
          alert("error");
          // Load the content in to the page.
          $("#output").html("&lt;p&gt;Page Not Found!!&lt;/p&gt;");
        },
        beforeSend: function () {
          alert("not yet");
        },
        complete: function () {
          alert("done");
        },
        success: function (strData) {
          alert("success");
          // Load the content in to the page.
          $("#output").html(strData);
        }
      });
      // Prevent default click.
      return(false);
    });
  })(jQuery);
&lt;/script&gt;
&lt;div id="output"&gt;&lt;/div&gt;


Please help me telling the website to accept my localhost request to pull data from the server. I have tested the same code on a pure PHP page and it is working fine.
You should wrap you javascript to user $ for jQuery, since it does not automatically refer to jQuery in Drupal 7. Try like that:

(function ($) {
  // Your code here
  $(document).ready(function() {
    // ...
  });
})(jQuery);


Reference: Managing JavaScript in Drupal 7