Node не может быть вставлен в указанной точке иерархии

Итак, я пытаюсь загрузить обычный текст из внешнего файла на мою страницу, и я продолжаю получать ошибку в заголовке. Что я делаю не так? (Я точно следил за учебником!) Спасибо.

HTML

<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.0/jquery.min.js"></script>
<script src="ajax.js"></script>
</head>

<body>
<input id="button" type="button" value="Load" />

<div id="content"></div>
</body>
</html>

JQuery

$("#button").click(function(){
    $.ajax({
      url:"AjaxRequest.html",
      success:function(data) {
      $("#content").html(data);
      }
    });
 });

РЕДАКТИРОВАТЬ: Похоже, что это не удалось. Не уверен, почему файл находится рядом с ним.

Ответ 1

Попробуйте указать тип данных:

$("#button").click(function(){
   $.ajax({
      url:"AjaxRequest.html",
      dataType:'html',
      success:function(data) {
        $("#content").html(data);
      }
   });
});

Ответ 2

попробовать

$("#content").append('<p>'+data+'</p>');