Разный результат работы $.ajax в почти идентичных условиях

[Maklay]

Есть небольшой php файлик который по запросу отдает:

<div id="Comment" class="dragable">Self: 1 | Enemy:2<br>
Self: 2 | Enemy:3<br>Self: 3 | Enemy:4<br>Self: 5 | Enemy:6<br></div>

Надо сделать данный див, дочерним по отношению в другом находящемуся в документе.

Суть вопроса:

В такой реализации:

$.ajax({
                url: '\SQL_connect.php',

                success: function (data) {
                    $('body').append(data);
                }
            });

все замечательно работает(при привязке к любому элементу).

Но при попытке сделать тоже самое для нескольких объектов:

let allObj = $('.circle');
            allObj.forEach = [].forEach;
            allObj.forEach(function (eObj, i, arr) {
                $.ajax({
                    url: '\SQL_connect.php',
                    success: function (data) {
                        eObj.append(data);
                    }
                });
            }
            );

К каждому div участвующему в переборе привязывается дочерним элементом, просто текстовая строка:

"<div id="Comment" class="dragable">Self: 1 | Enemy:2<br>Self: 2 | Enemy:3<br>Self: 3 | Enemy:4<br>Self: 5 | Enemy:6<br></div>"

То есть привязывается все куда надо, но просто текстом, а не элементом DOM. Подскажите как исправить сей момент.

[Rise]

$(eObj).append(data);

[Maklay]

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

[Aetae]

eObj в данном случае нативный элемент DOM, а не jQuery-объект, т.к. jQuery-объект если забирать из него элементы по индексу отдаёт именно нативные элементы, а не новые jQuery-объекты.
Также недавно в современных браузеров у элементов появился модный метод append, который либо делает appendChild, если передан другой DOM элемент, либо, если передана строка, добавляет оную как текстовый узел. Ещё год назад у вас бы просто всё валилось с ошибкой и было бы проще понять в чём проблема.

Решение проблемы в лоб: завернуть элемент обратно в jQuery:

eObj.append(data);
// -->
$(eObj).append(data);

Но имхо, чем бессмысленно насиловать сервер на каждый элемент, разумнее сделать так:

$.ajax({
  url: '\SQL_connect.php',
  success: function (data) {
    $('.circle').append(data);
  }
});

jQuery прекрасно умеет работать с группами элементов сам.