如何使用jquery / javascript从嵌套的ul li制作json

Question

我有一个动态嵌套的ul li like，

<div id="data">
    <ul>
        <li><span>1</span>
            <ul>
                <li><span>1.1</span></li>
                <li><span>1.2</span></li>
                <li><span>1.3</span>
                    <ul>
                        <li><span>1.3.1</span></li>
                    </ul>
                </li>
            </ul>
        </li>
        <li><span>2</span></li>
    </ul>
</div>

我想将此嵌套列表转换为json，如下所示

{
    "1": {
        "1.1": "val",
        "1.2": "val",
        "1.3": {
            "1.3.1": "val"
        }
    },
    "2": "val"
}

我该怎么做？我尝试了一些递归算法，但我找不到这个的确切递归逻辑。

更新

这是我试过的......

function test() {
    data = {}
    testRecur($("#data").children('ul'), data);
    console.log(data.toSource());
}

function testRecur(next, data) {
    var newDataJson = {}
    $(next).children('li').each(function (idx, element) {
        value = $(element).children('span').first().html();
        if ($(element).find('ul').length > 0) {
            data[value] = testRecur($(element).find('ul').first(), data);
        } else {
            newDataJson[value] = "val";
        }
    });
    return newDataJson;
}