Element:insertAdjacentHTML()

（Web API ＞ Element）
https://developer.mozilla.org/ja/docs/Web/API/Element/insertAdjacentHTML

element.insertAdjacentHTML(position, text)

Element オブジェクトの insertAdjacentHTML メソッドを使うと、指定した文字列からノードを作成し追加することができる。
2 番目の引数に指定した文字列を HTML 文として解析し、 HTML 文からノードを作成する。作成したノードを 1 番目の引数で指定した位置に追加する。
1 番目の引数にはノードを追加する位置を文字列で指定する。指定できる値は次の 4 つである。

• ‘beforebegin’：element の前に追加
• ‘afterbegin’：element の子要素の先頭に追加
• ‘beforeend’：element の子要素の最後に追加
• ‘afterend’：element の後に追加

// id 属性が xxx の要素ノードのあとに引数に指定した文字列から作成したノードを追加する
let element = document.getElementById('xxx');
element.insertAdjacentHTML('afterend', '<p>Hello</p>');