unable to load xml from external file using jQuery

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

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!