unable to load xml from external file using jQuery

Question

I'm trying to load external xml using the following code but it is not working

$( document ).load( "data.xml", function(  response, status, xhr ) {        
    console.log( xhr.status + " " + xhr.statusText );
  });

I have both data.xml and js file in same folder.

In chrome it returns 404 error .

In FF it retuns 0 [Exception... "Access to restricted URI denied" code: "1012" nsresult: "0x805303f4 (NS_ERROR_DOM_BAD_URI)" .

I couldn't understand why this happens? Please shed some light on this issue.

Updates: I gave a shot using $.get() as mentioned below but still no success.

Meanwhile I also gave a try using pure js like below

function loadXMLDoc(dname) {
    if (window.XMLHttpRequest)    {
      xhttp=new XMLHttpRequest();
      }
    else {
      xhttp=new ActiveXObject("Microsoft.XMLHTTP");
      }
    xhttp.open("GET",dname,false);
    xhttp.send();
    return xhttp.responseXML;
}
    xmlDoc=loadXMLDoc("data.xml");
    console.log(xmlDoc);

Still facing errors.

Error in FF: NS_ERROR_DOM_BAD_URI: Access to restricted URI denied [Break On This Error]

xhttp.send();

and

Error in chrome: XMLHttpRequest cannot load file:///C:/Users/admin/Desktop/public_html%281%29/public_html/data.xml. Cross origin requests are only supported for HTTP. xml.js:13 Uncaught NetworkError: A network error occurred.

Updates: I found this question useful, but is there any way to solve this problem?

Answer 1

Maybe this is what you are looking for....

$(document).ready(function(){
    $.ajax({
        url: 'data.xml',
        dataType: 'xml',
        success: function(response, status, xhr){
           console.log( xhr.status + " " + xhr.statusText );
        }
     });
});

UPDATE

Read this post

Answer 2

After a long struggle and with the help of community I figured out the issue.

The same-origin policy restricts how a document or script loaded from one origin can interact with a resource from another origin.

Means this is not possible with the system file, so with the help of this answer , I used WAMPServer to run my script and it worked like a charm.

 $.get("http://localhost/public_html(1)/public_html/xml/data.xml",
                                     function(  response, status, xhr ) {        
        console.log( response );
    });

Thank you!