Создание html элемента в DOM средствами Javascript

Доброе время суток, подскажите пожалуйста как этот код написать на VanillaJs Знаю о существовании <div>Текст</div> , но по итогу получается текст, а не html...

$('#modal-login, .modal-backdrop').remove();

html  = '<div id="modal-login" class="modal fade" tabindex="-1">';
html += '  <div class="modal-dialog modal-dialog-centered modal-fullscreen-sm-down modal-md">';
html += '    <div class="modal-content">';
html += '    </div>';
html += '  </div>';
html += '</div>';

$('body').append(html);

$('#modal-login').modal('show');

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

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

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

const div = document.createElement('div')

const newModal = `
<div id="modal-login" class="modal fade" tabindex="-1">
  <div class="modal-dialog modal-dialog-centered modal-fullscreen-sm-down modal-md">
    <div class="modal-content">
      Тест
    </div>
  </div>
</div>`
div.innerHTML = newModal
document.body.append(div); 

→ Ссылка