Error when trying to get a response from Web API URL via Javascript jQuery call -

i've piece of code supposed json answer localhost site. if browse url chrome, response, if try run code html page error (via vs debug).

any ideas?

$(document).ready(function () {   alert("hello");   var request = $.ajax({     url: "http://localhost:3157/api/products",     type: "get",     datatype: "json"   });   request.done(function(msg) {     alert("msg is: " + msg);   });   request.fail(function (jqxhr, textstatus) {     alert("request failed: " + textstatus);   }); }); 

update - added xml output

<arrayofproduct xmlns:i="http://www.w3.org/2001/xmlschema-instance"     xmlns="http://schemas.datacontract.org/2004/07/firstwebapi.models">     <product>         <category>groceries</category>         <id>1</id>         <name>tomato soup</name>         <price>1</price>     </product>     <product>         <category>toys</category>         <id>2</id>         <name>yo-yo</name>         <price>3.75</price>     </product>     <product>         <category>hardware</category>         <id>3</id>         <name>hammer</name>         <price>16.99</price>     </product> </arrayofproduct> 

make sure respone url in json format