Как вставить блок кода в определенное место в html через js?

Question

[Hiroshima]

К примеру мне нужно вставить вот такой блок:

<li>
                    <p>От:</p>
                    <div>
                        <p></p>
                    </div>
                </li>

Его нужно вставить в блок с классом messegs:

<ul class="messegs">

                <li>
                    <p>От:</p>
                    <div>
                        <p></p>
                    </div>
                </li>

            </ul>

я тока знаю как сделать чтобы просто в документе появился:

function test() {
    let ul = document.createElement('li');
    ul.className = "num-mes";
    ul.innerHTML = "<p>От:</p> <div><p></p></div>";


    document.body.append(ul);
}

Comments

[Олег]

Кривая практика в li вставлять div

[Hiroshima]

Олег, А как надо?

Answer 1

[Tim]

заменит все содержимое #messegs:

document.querySelector('#messegs').innerHTML = '<li><p>От:</p><div><p></p></div></li>';

Добавит содержимое в #messegs:

let li = document.createElement('li');
li.innerHTML = "<p>От:</p> <div><p></p></div>";
document.querySelector('#messegs').append(li);