Использование AJAX Загрузить статью Array в div с определенным классом и ничего не делать в случае сбоя соединения

Question

Хотелось бы добавить возможность отображения некоторых статей на ранее статичном сайте.Статьи хранятся во внешней базе данных.Статьи должны быть получены на стороне клиента (браузера) и затем отображены внутри тега, который имеет класс articles-list.Существует ровно один такой тег, и он имеет пустой контент.Вот пример такого тега:

<div class="articles-list"></div>

Данные о товаре для этого тега можно получить, вызвав AJAX-вызов следующей конечной точки:

https://www.example.com/articles Ответформат выглядит следующим образом:

[{
    'title': 'What is the difference between example 1 and example 2?',
    'content': 'In example 2 a connection error occurs.'
}, {
    'title': 'Good pancakes for dummies.',
    'content': 'This book is great. I learned how to cook in two days!'
},
    ...
]

Предполагается, что структура DOM каждой статьи будет:

<div class="article">
    <div class="article-title">{title}</div>
    <div class="article-content">{content}</div>
</div>

Если при загрузке произойдет какая-либо ошибка, документ не следует изменять.

Напишите функцию: function solution();, которая, учитывая дерево DOM, представляющее документ HTML, отображает статьи, как описано выше.Необходимо использовать jQuery.ajax для доступа к API.

Например, если указан документ, содержащий

<div class="articles-list"></div>

и ответ:

[{
    'title': 'What is the difference between example 1 and example 2?',
    'content': 'In example 2 a connection error occurs.'
}, {
    'title': 'Good pancakes for dummies.',
    'content': 'This book is great. I learned how to cook in two days!'
}]

, затем документдолжно содержать:

<div class="articles-list">
    <div class="article">
        <div class="article-title">What is the difference between example 1 and example 2?</div>
        <div class="article-content">In example 2 a connection error occurs.</div>
    </div>
    <div class="article">
        <div class="article-title">Good pancakes for dummies.</div>
        <div class="article-content">This book is great. I learned how to cook in two days!</div>
    </div>
</div>

В еще одном примере вам дается документ, содержащий

<div class="articles-list"></div>

, но при загрузке статей возникает ошибка соединения.В этом случае документ должен оставаться прежним.

Примечание: дерево DOM представляет действительный документ HTML5;JQuery 2.1.4 поддерживается;количество статей будет в диапазоне 0 to 100;, текст ответа на вызов AJAX будет содержать действительный JSON;данные ответа могут быть или не быть очищены.