ワードプレスのプラグインで翻訳した際の綴りを変更したい。

前提・実現したいこと

ワードプレスの翻訳のプラグインを用いた際に、綴りが違うのでそれを修正したいとおもい、翻訳するボタンを押した時をイベントの発火のタイミングとしてjQueryを使用して特定の文字の綴りだけを変更したいです

使用プラグイン
https://ja.wordpress.org/plugins/google-language-translator/

例)
翻訳ボタンを押した時、長野という文字がNagano表示されるがTyonoに変更する
Nagano　→　Tyono

下記のサイトを参考にreplaceで変更しようと考えました。
https://www.tsukimi.net/jquery_replace_in_bulk.html

使用したプラグインで翻訳をおこなうと、

HTML
1<font><font>Nagano</font></font>

というようなhtml要素が作られるのでそのクラスを指定して、サイト内に散らばっている変更したテキストを変更しようと考えました。

発生している問題

下に記載しましたコードで
console.log(rep)
をみるとサイト内の対象の文字はうまく変換されているのですが、サイト内に反映されていないので、原因がわからずに止まっております。
やってる内容としてはおそらく変わらないと思いましたが、html()でなくtext()で変換後のコードを反映しようとしてもうまく行きませんでした。

該当のソースコード

現状(例)

html
1<!-- 翻訳ボタン押す前 -->
2<div>
3  <div>長野</div>
4  <h1>長野</h1>
5  <p>長野</p>
6</div>
7
8<!-- 翻訳ボタン押した後 -->
9<div>
10  <div>
11    <font style="vertical-align: inherit"><font style="vertical-align: inherit">Nagano</font></font>
12  </div>
13  <h1>
14    <font style="vertical-align: inherit"><font style="vertical-align: inherit">Nagano</font></font>
15  </h1>
16  <p>
17    <font style="vertical-align: inherit"><font style="vertical-align: inherit">Nagano</font></font>
18  </p>
19</div>

javascript(jQuery)
1$('a.united-states').on('click', function() {
2//a.united-statesは翻訳ボタンの要素
3
4  $('font font').each(function() {
5    var txt = $(this).html();
6    var rep = txt.replace(/Nagano/g, 'Tyono');
7    $(this).html(rep);
8
9    console.log(rep);//確認用
10  });
11
12});