MutationObserver：動的に追加した要素に対して処理できない

前提・実現したいこと

動的にPHPで出力した要素にMutationObserverを使ってオートリンクしたいです。

発生している問題・エラーメッセージ

エラーはないのですが、オートリンクされません。
以下コード

該当のソースコード

js
1const target = document.querySelector('.room');
2   const observer = new MutationObserver(function () {
3     let room = document.querySelector('.room');
4     let exp = /(\b(https?|ftp|file)://[-A-Z0-9+&@#/%?=~_|!:,.;]*[-A-Z0-9+&@#/%=~_|])/gi;
5     room.innerHTML = room.innerHTML.replace(exp, "<a target=\"_blank\" class=\"icon-lnr icon-exit\" href='$1'>$1</a>");
6   });
7   const config = {
8     attributes: true,
9     childList: true,
10     characterData: true
11   };
12   observer.observe(target, config);

html
1<div class="room">
2  <div>
3    <!-- 動的に追加された内容 -->
4    <p>https://twitter.com/xxx/</p>
5    <!-- ここまで -->
6  </div>
7</div>

試したこと

MutationObserverについての記事を沢山読み、それぞれの書き方で試しましたが、上手くいきません。また、target がquerySelectorAll の場合はどうすればよいでしょうか。

エラーがないので何が間違っているのか全く分からず困っています。どうかご助力ください。

補足情報（FW/ツールのバージョンなど）

Firefox 最新版

行動規範の内容に同意します

回答1件

自己解決

js
1tttt = document.querySelector('.room');
2  options02 = {
3    childList: true,
4    characterData: true,
5    characterDataOldValue: true,
6    attributes: true,
7    subtree: true,
8  }
9  function call02(mutationsList, observer) {
10    for (const mutation of mutationsList) {
11      tar = mutation.target // target
12      add = mutation.addedNodes // add DOM
13      remove = mutation.removedNodes // delate DOM
14      let exp = /(\b(https?|ftp|file)://[-A-Z0-9+&@#/%?=~_|!:,.;]*[-A-Z0-9+&@#/%=~_|])/gi;
15      tar.innerHTML = tar.innerHTML.replace(exp, "<a target=\"_blank\" class=\"icon-lnr icon-exit\" href='$1'>$1</a>");
16    }
17    obs02.disconnect();
18  }
19  obs02 = new MutationObserver(call02);
20  obs02.observe(tttt, options02);