parse arrays in array structure to unordered list in js

How to parse js array in the form similar to:

const arr = [
            "&&",
            [
                "==",
                "first",
                "1-1"
            ],
            [
                "&&",
                [
                    "==",
                    "second1",
                    "2-1"
                ],
                [
                    "==",
                    "second2",
                    "2-2"
                ]
            ]
        ]

to HTML unordered (ul) list in the form:

    <li>&&
        <ul>
            <li>first == 1-1</li>
            <li>&&
                <ul>
                    <li>second1 == 2-1</li>
                    <li>second2 == 2-2</li>
                </ul>
            </li>
        </ul>
    </li>
</ul>

As you can guess, I need an UI to edit arr content. Arr represents form of ‘where’ filter definition in JSON string. So when user changes list (adding or removing nodes in unordered list)i will need to parse changes back to array, but first things first.
Maybe there is some library for that but i was unable to find it.

I tried recursion like this:

    function arrayToHTML(arr, container) {
    if (!Array.isArray(arr) || arr.length === 0) return
    const operator = arr[0]
    const conditions = arr.slice(1)
    if (operator === '&&') {
    this.arrayToHTML(conditions, container)
    }
    }