Javascriptで数式番号の記載を実装したい

しっかり自分で考えて悩んでいるみたいだから、面識も無い相手にわざわざ時間を掛けて回答文を作ったにもかかわらず、俺が知っていることが何でお前が知らんのやみたいなエスパーな返答が送られたり、そんなの相手に無駄に労力割かされたり散々な目に会ったのに、設計のまずさを棚にあげつつ自分が思った結果が来なかったからブチ切れる結末で、本当に不毛な質問に出会ってしまったと実感してます。
もっと人生経験つまないかんですよ。対価も出さずに質問して気に入らなかったら暴言吐きまくりって何様よ？

プログラマー2年目っていうけど実世界でもこんなことしてたらレビューアから無視されちゃうよ。
自分のハテブだけで使うから俺仕様でOKなんだろうけど、そこはそちらが言わないとわかんないでしょ。
数学の[証明]のよう自分が求めたいものを自分一人で答え出せた時は気持ち良いだろうよ。答えが出ない時は自分にムカムカするでしょ？今回自分で答え出せないものを質問しといて、答えが得られなかったのを他人のせいにするのはおかしいですよね？
［証明］俺がこの問題を証明できないのは、この問題が悪い

ベストアンサーを’授ける’つもりで質問してたの？それなら対価アリできちんと仕事を依頼したほうがいいですよ。

…1文がなげーよ。

批判の意図はないのですが、質問者は望まない回答になると思います。ただ、teratailはQAプラットフォームであり、将来訪問されるかたに、ここにref/labelについて有益な質問・回答がないことを告知するために回答を残します。

 回答:

仕様を見直されるべきかと思います。

 理由:

以下、texのlabel/refっぽいものがつくりたい、が前提であり目的であると仮定しています。

 理想の不整合

ここから(3-1)
と出力されることです。

はおかしいと思います。これがrefであるならlabel側の数値を持ってこないといけない。labelのfukasa2は「やりたいこと」の要件に照らしても"2-2-3"だと考えられる。そこのliにあるものを使うとしても"2-3"。"3-1"にはならない。と思う

 idの設計

タグを書く時点でユーザが、深さや番号を指定するというのはおかしい。番号は機械が付与すべき。texのrefやlabelでもそのようなことはしないはず。参照番号の記入は、refは何らかの方法で対応付けられたlabelが所属する文脈に付与される数値を取ってくる、という仕様だと考えられます。
idを人間が指定するのは端的に手間であるのみならず、万一間違った番号が書かれていた場合ulとliの階層から取れる番号を付与するのか、間違っていても書かれた値を採用するのかの迷いを生むだけで、有害無益です。
(texを使っておられるくらいなので、一旦書いたあとにパラグラフを移動させたいことがあることは想像ができると思います。そのときにidを直すのでしょうか？)

 liのinner

ここに数値をかくのはおかしいです。前段と同じですが、番号を手で入れるのはおかしい。説明としての仮の値を入れているのだとしたら、もっと誤解をまねかない文字列にしたほうがよいです。

 処理の流れ

1. ノードに番号を付与する(labelの値が決まる)
2. 参照先に番号を付与する(refの数値を埋める)

という異なる2つの動作をする必要があると思います。 
labelのidには[1-1]や"2番目の深さの1"などではなく、refで使う名前だけを入れるだけで十分だと思います。

https://lesguillemets.github.io/blog/2014/09/18/katex0.html

javascript でtexの実装があります、これを使ってみては？

・質問
checkLabelNodeが無限ループになってブラウザがフリーズするが、素人なので問題の特定ができずスタックしている

・回答
jQueryの基本なんですが、メソッドチェーンをする都合上、多くのメソッドがjQueryオブジェクトを返します。!= undefinedをしても、jQueryオブジェクトはundefinedではないから再帰が止まりません。

        if(node.children().length > 0){
            checkLabelNode(node.children().first(), newDepth, newNum);
        }
        if(node.next().length > 0) {
          checkLabelNode(node.next(), newDepth, newNum);
        }
        return;
    }

こうやれば、to be removedのところに(3-3)と表示されます。一旦は3-1と出したいとおっしゃってましたが、番号に何をふるのかは俺の勝手だ、という設計のようなのでこれで。

後学のために逆に質問します。

MathJaxを使わなくなった理由って何でしょうか？
レスポンス？融通が効かない？

結局自己解決できました。
一応、参考までに私が作ったテストコードを載せておきます。

<script type="text/javascript">
    var hash_map_label = {};

    function checkLabelNode(node, depth, num){
        var newDepth = depth;
        var newNum = num;
        if(node.is('ul')){
            newDepth = newDepth+1;
            newNum = 0;
        } else if(node.is('span.label')){
            newNum++;
            var str = "(" + newDepth + "-" + newNum + ")";
            hash_map_label[node.attr("id")] = str;
            node.text(str);
        }
        if(node.children()[0]){
            newNum = checkLabelNode(node.children().first(), newDepth, newNum);
        }
        if(node.next().length){
            checkLabelNode(node.next(), newDepth, newNum);
        }

        return newNum;
    }
    $(function(){
        checkLabelNode($('.functest').first(), 0, 0);
        $('span.ref').each(function(index){
            $(this).text(hash_map_label[$(this).text()]);
        });
    });
</script>
<div class="functest">
<ul>
    <li>1</li>
    <li>2<span class="label" id="sample" />
    <ul>
        <li>1-1<span class="label" id="1-1" /></li>
        <li>1-2<span class="label" id="1-2" />
        <ul>
            <li>2-1</li>
            <li>2-2</li>
            <li>2-3<span class="label" id="fukasa2" /></li>
        </ul>
        </li>
        <li>1-3<span class="label" id="1-3" /></li>
        <li>1-4
        <ul>
            <li>2-1<span class="label" id="2番目の深さ1" /></li>
            <li>2-2</li>
            <li>2-3<span class="label" id="2番目の深さ2" /></li>
        </ul>
        </li>
    </ul>
    </li>
    <li>2の所を引用：<span class="ref">sample</span></li>
    <li>2の1-1の所を引用：<span class="ref">1-1</span></li>
    <li>2の1-2の所を引用：<span class="ref">1-2</span></li>
    <li>2の1-3の所を引用：<span class="ref">1-3</span></li>
    <li>2の1-2の2-3の所を引用：<span class="ref">fukasa2</span></li>
    <li>2の1-4の2-1の所を引用：<span class="ref">2番目の深さ1</span></li>
    <li>2の1-4の2-3の所を引用：<span class="ref">2番目の深さ2</span></li>
</ul>
</div>

このサイトなら良い指針やアドバイスが得られると思って、わざわざ時間を掛けて質問文を作ったにもかかわらず、アスペみたいな見当違いの的外れの回答が送られたり、そんなのの相手に無駄に労力割かされたり散々な目に会ったのに、結局は自力で解決するという結末で、本当に不毛なことをさせられたと実感してます。
teratailはもっと経験豊かな人が居るんじゃないんですか？どうなってんの？178viewもありながら(確認時点で)…

当然、ベストレビュアーは無しとします。