Derbakov

fetch('https://jsonplaceholder.typicode.com/albums')
  .then(r => r.json())
  .then(r => {
    const keys = [ 'userId', 'id', 'title' ];

    // собираем разметку
    document.body.insertAdjacentHTML('beforeend', `
      <div class="wrapper">${r.map(n => `
        <div class="item">${keys.map(k => `
          <div>${k}: ${n[k]}</div>`).join('')}
        </div>`).join('')}
      </div>
    `);

    // или, создаём элементы напрямую
    function createElement(tag, className, children) {
      const el = document.createElement(tag);
      el.className = className;
      el.append(...children);
      return el;
    }

    document.body.append(
      createElement('div', 'wrapper', r.map(n =>
        createElement('div', 'item', keys.map(k =>
          createElement('div', '', [ `${k}: ${n[k]}` ])
        ))
      ))
    );
  });

.wrapper {
  border: 3px solid black;
  padding: 10px;
  margin: 10px;
}

.item {
  border: 1px solid silver;
  padding: 5px;
  margin: 5px;
}

fetch('https://jsonplaceholder.typicode.com/albums')
.then(response => response.json())
.then(data => data.forEach((album) => {
document.body.insertAdjacentHTML('beforeEnd',  `
<p>${album.userId}</p>
<p>${album.id}</p>
<p>${album.title}</p>
`)
}))