```html <select id="position"> <br /> <option>beforebegin</option>

<option>afterbegin</option> <option>beforeend</option> <option>afterend</option>

</select>

<button id="insert">Insert HTML</button> <button id="reset">Reset</button>

Some text, with a code-formatted element inside it.

```

```js const insert = document.querySelector("#insert"); insert.addEventListener("click", () => { const subject = document.querySelector("#subject"); const positionSelect = document.querySelector("#position"); subject.insertAdjacentHTML( positionSelect.value, "inserted text" ); });

const reset = document.querySelector("#reset"); reset.addEventListener("click", () => { document.location.reload(); });

```

js var mylist = document.getElementById('mylist'); mylist.insertAdjacentHTML('beforeend', '<li>third</li>');

```html

• first
• second

```