Estoy usando ajax para recuperar algunos datos de json. Cuando coloco un script dentro del HTML, funciona bien, pero cuando realizo una solicitud ajax desde un archivo JS, no funciona. No estoy seguro de por qué. He comprobado que el archivo json está en el mismo directorio que todos los demás archivos. Además, mi archivo HTML incluye la ruta correcta a mi archivo JS. A continuación se muestra el código con script dentro del archivo html
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <link rel="stylesheet" href="Project.css"> <script src="https://code.jquery.com/jquery-3.1.1.min.js"></script> <script src = "Project.js"></script> </head> <body> <div id="div1"> <strong><p id="loved">Secret code</p></strong> <button id="button6">click me</button> </div> <script> //ajax call to retrieve json file on everydayuse page ( that works fine) $("#button6").click(function() { $.ajax({ type:"GET", url:"package.json", dataType:"json", success:function(result) { $("#div1").html(""); $("#div1").append("Use code to receive free shipping:" + "<h3 style='color:deeppink'>"+ result.name+ "</h3>" + "By:" + "<h3 style='color: deeppink'>"+result.date+ "</h3>"); } }); }); </script> </body> </html>