jquery - 第3レベルのli要素を上に移動してulを削除するにはどうすればよいですか？

Question

この例のように、ネストされたリストで構成される、かなり大きな3レベルの深さのメニューがあります。

<ul class="nav">
    <li><a href="#">1</a>
        <ul>
            <li><a href="#">2</a>
                <ul>
                    <li><a href="#">level 3</a></li>
                    <li><a href="#">level 3</a></li>
                    <li><a href="#">level 3</a></li>
                </ul>
            </li>
            <li><a href="#">2</a>
        </ul>
    </li>
</ul>

メニューについては、2つのレベルのみで作業したいので、3つ目のレベルを削除し、ulスタイリングの目的でその（以前の）子にクラスを追加します。

これはjQueryで実行できますか？結果は次のようになります。

<ul class="nav">
    <li><a href="#">1</a>
        <ul>
            <li><a href="#">2</a></li>
            <li class="third"><a href="#">level 3</a></li>
            <li class="third"><a href="#">level 3</a></li>
            <li class="third"><a href="#">level 3</a></li>
            <li><a href="#">2</a></li>
        </ul>
    </li>
</ul>

どんな助けでも大歓迎です！

Answer 1

これはそれを行う必要があります：

$('ul ul ul').each(function() {
    $(this).parent().after($(this).find('li').addClass('third'));
    $(this).remove();
});

3番目のレベルのULエレメントごとに、ULの親エレメントの後にすべての子LIエレメントを挿入してから、UL自体を削除します。

Answer 2

$('ul ul ul').each(function() {
  $(this).parent().after($(this).find('li').addClass('third'));
  if (!$(this).parents('.exception').length){
   $(this).remove();
  }
});

Answer 3

$('ul ul ul li').addClass('third').unwrap().each(function() {
    $(this).parent().after($(this))
})