Использование строк шаблона для добавления HTML

Новый для es6, есть ли способ добавить HTML, используя литералы шаблонов `` в DOM, не перезаписывая то, что было опубликовано в данный момент?

У меня есть огромный блок HTML, который мне нужно опубликовать для создаваемого списка. Где пользователь может опубликовать свой ввод.

Каждый раз, когда задача отправляется, она перезаписывает текущую отправку. Мне нужно, чтобы это было добавлено внизу.

рабочий пример для демонстрационных целей.

https://jsfiddle.net/uw1o5hyr/5/

 <div class = main-content> 

 <form class ='new-items-create'>

 <label>Name:</label><input placeholder = " A Name" id = "name">


 <button class = "subBtn">Submit</button>

 </form>


 </div>

  <span class = "new-name"></span>


JavaScript

form.addEventListener('submit',addItem);

 function addItem(event){
 event.preventDefault();
 let htmlStuff = 
    ` 
     <div class = "main">
    <div class = "a name">
     <span>${name.value}</span>
    </div>
    <div>
    `

   itemCreated.innerHTML = htmlStuff;


   }