以下是一个示例解决方案，使用JavaScript和HTML来动态创建包含API提取文章的单独div：

1. HTML代码：

2. JavaScript代码（保存为script.js文件）：

window.onload = function() {
    // 假设API返回的文章数据存储在变量articles中
    var articles = [
        {title: "文章1", content: "这是文章1的内容。"},
        {title: "文章2", content: "这是文章2的内容。"},
        {title: "文章3", content: "这是文章3的内容。"}
    ];

    var articlesDiv = document.getElementById("articles");

    // 遍历文章数组
    articles.forEach(function(article) {
        // 创建一个新的div元素
        var div = document.createElement("div");

        // 设置div的样式
        div.style.border = "1px solid black";
        div.style.marginBottom = "10px";
        div.style.padding = "10px";

        // 创建标题元素并设置内容
        var titleElement = document.createElement("h2");
        titleElement.textContent = article.title;

        // 创建内容元素并设置内容
        var contentElement = document.createElement("p");
        contentElement.textContent = article.content;

        // 将标题和内容元素添加到div中
        div.appendChild(titleElement);
        div.appendChild(contentElement);

        // 将div添加到页面中的articlesDiv中
        articlesDiv.appendChild(div);
    });
};

这个示例代码会在页面加载完成时创建一个包含文章标题和内容的div，并添加到页面中的id为"articles"的元素中。你可以根据实际需要调整样式和数据结构。