Javascript – Need help to create animation to randomly change text characters in JS

I need to make animation like on this website in menu:
https://displaay.net/typefaces/retail/

Is there an existing solutions? I’ve tried to make it with copilot, but didn’t succeed.

<script>
document.addEventListener('DOMContentLoaded', function() {
    var titles = [
        'Text1',
        'Text12',
        'Text3'
    ];
    var currentIndex = 0;

    function changeTitle() {
        // Select the _H1 element
        var element = document.querySelector('._H1');
        if (element) {
            // Split the current title into characters and wrap each character in a span
            var chars = element.textContent.split('');
            element.innerHTML = chars.map(char => `<span>${char}</span>`).join('');

            // Function to change a character to a random one
            function changeChar(index) {
                if (index < chars.length) {
                    var randomChar = String.fromCharCode(Math.floor(Math.random() * (126 - 33 + 1)) + 33);
                    chars[index] = `<span class="animate">${randomChar}</span>`;
                    element.innerHTML = chars.join('');
                    setTimeout(() => changeChar(index + 1), 20); // Adjust the delay as needed
                } else {
                    // After all characters have changed, change the text to the next title
                    setTimeout(() => {
                        element.innerHTML = titles[currentIndex];
                        currentIndex = (currentIndex + 1) % titles.length; // Loop through the titles
                    }, 2000); // Wait for 2 seconds before changing the text
                }
            }

            // Start changing the characters
            changeChar(0);
        }
    }

    // Change the title immediately and then every 5 seconds
    changeTitle();
    setInterval(changeTitle, 5000); // 5000 milliseconds = 5 seconds
});