как добавить в разметку несколько объектов, созданных конструктором?

С помощью конструктора создается блок и отображается в разметке страницы. Как сделать, чтобы последующие блоки тоже отображались?

https://codepen.io/wfedoruk/pen/BaWQBqz

document.addEventListener('DOMContentLoaded', function() {
  var heading = document.getElementById('heading').value;
  var text = document.getElementById('text').value;

  function Block(a, b) {
    this.heading = a;
    this.text = b;
  }

  function makeBlock() {
    var heading = document.getElementById('heading').value;
    var text = document.getElementById('text').value;
    var text_inner = document.querySelector('.text_inner');
    var block = new Block(heading, text);

    var blockForm = ' <div class="block"><a href = ""><div class="link"><div class="image_inner"><img src="" alt=""></div><div class="heading_inner"></div><div class="text_inner"></div>';
    document.getElementById("blocks").innerHTML = blockForm;
  }
  document.getElementById('create').addEventListener('click', makeBlock);
);

Ответы (1 шт):

Автор решения: Pilaton

document.getElementById("blocks").innerHTML = blockForm; замените на document.getElementById("blocks").insertAdjacentHTML('beforeend', blockForm);.

Используя innerHTML вы перезаписываете один и тот же блок.

→ Ссылка