Итерация по объекту JSON, возвращенному из запроса AJAX

Question

Во-первых, я довольно плохо знаком с javascript и веб-разработкой в ​​целом (я давно пишу приложения для Windows).

Я извлекаю массив объектов JSON из внешнего веб-сервиса и использую php-прокси для получения JSON через AJAX. Я могу проанализировать объект JSON с помощью eval (), но не могу перебрать массив.

Вот моя функция onreadystatechange ...

if(this.readyState == 4)
            {
                if(this.status == 200)
                {
                    if(this.responseText != null)
                    {
                        var text = "";
                        var object = eval("(" + this.responseText + ")");

                        for (var i = 0; i < object.length; i++)
                        {
                            text+= "<p><img src=\"" + object[i].avatar_url + "\"/>";
                            text+= object[i].username + "</p>";
                        }

                        document.getElementById("content").innerHTML = text;
                    }
                }
            }

Я получаю ошибку «StartTag: неверное имя элемента» в «<» в цикле for. JSON хорошо отформатирован, и если я запускаю этот код просто как скрипт (то есть без AJAX), я могу просто перебирать массив. </p>

Я бы предпочел не использовать какие-либо внешние библиотеки, такие как JQuery, поскольку я все еще пытаюсь разобраться с основами.

Заранее спасибо.