DOMDocumentによるHTMLの書き換えについて

WordPressで記事の本文を取得しツールチップを表示させるためHTMLの書き換えを行うプログラムを書いているのですが、単純にstr_replace関数を使うと置換させたくない箇所（HTMLの属性値など）も置換されてしまいます。

そこでDOM操作でtextContent部分を取得し書き換える方法にし説明文を加えた要素を作ることはできたのですが、置き換えるやり方がわかりません。

最後に記述しているプログラムだと文の一番最後にツールチップが表示される状態です。

appendChildが末尾に追加することが原因なのはわかっています。

PHP
1<dd>数値を 素因数分解 した値を格納した配列を返します。<span class="tooltip" aria-label="ある正の整数を素数の積の形で表すこと">素因数分解</span></dd>

本当は以下のように書き換わって欲しいです。

PHP
1<dd>数値を <span class="tooltip" aria-label="ある正の整数を素数の積の形で表すこと">素因数分解</span> した値を格納した配列を返します。</dd>

"glossary"というデータベースに単語（name）と説明文（description）が登録されていて、ツールチップは以下のHTMLで表示されるようになっています。

HTML
1<span class="tooltip" aria-label="【説明文】">【単語】</span>

また書き換えを行いたい要素は現時点で「$xpath->query('//dd');」としていますが、実際にはCSSセレクタで記述すると「div.highlightjs pre code」以外の要素（textContent）にしたいです。

querySelectorAllで要素を絞ってみたのですがエラーとなってしまいました。

色々と調べながら修正してきたのですが、自力ではここまでが限界です。

回答よろしくお願いします。

PHP
1add_filter('the_content', function($content){
2 $content = tooltip($content);
3	return $content;
4}, 11);
5
6function tooltip($content){
7	global $wpdb;
8	$dom = new DOMDocument();
9	@$dom -> loadHTML('<!DOCTYPE html><html lang="ja"><head><meta charset="utf-8"><title></title></head><body>' . $content . '</body></html>');
10	// 
11	$sql = 'SELECT name, description FROM glossary;';
12	$rows = $wpdb -> get_results($sql, ARRAY_A);
13	foreach($rows as $row){
14		$xpath = new DOMXpath($dom);
15		$nodes = $xpath->query('//dd');
16		foreach($nodes as $node){
17			if(preg_match("/\s" . $row["name"] . "\s/i", $node -> nodeValue)){
18				$span = $dom -> createElement("span");
19				$span -> textContent = $row["name"];
20				$span -> setAttribute("class", "tooltip");
21				$span -> setAttribute("aria-label", $row["description"]);
22				$node -> appendChild($span);
23			}
24		}
25	}
26	return $dom -> saveHTML();	
27}