Как добавить элементу новый тег?

• Создание элементов осуществляется функцией document.createElement
• Изменение поддерева элемента может быть осуществлено несколькими способами:
  • присваиванием свойству .innerHTML нужного html-кода
  • присваиванию свойству textContent нужного текста (для случаев, когда элемент не содержит вложенных элементов)
  • добавление элемента в конец списка дочерних элементов с помощью метода appendChild
• Связанные статьи на learn.javascript.ru: Свойства узлов и Добавление и удаление узлов

Таким образом, имея элемент <li> (созданный через document.createElement, либо изначально находившийся в html, полученный методами document.getElementById/document.querySelector/document.getElementsByClassName) можно добавить к нему новый элемент <div> методом appendChild:

let li = document.createElement('li'); 
let inner = document.createElement('div'); 
inner.textContent = 'Hi'; 
li.appendChild(inner); 
 
// чтобы сниппент что-нибудь отобразил 
document.body.appendChild(li);

либо добавив нужный html-код к свойству .innerHTML:

let li = document.createElement('li'); 
li.innerHTML += '<div>Hi</div>'; 
 
// чтобы сниппент что-нибудь отобразил 
document.body.appendChild(li);

Можно сделать

var li = document.createElement('li');
li.innerHTML += '<div>Hi</div>';