麻烦帮忙看一下代码实现还有需要继续优化的么？

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>Document</title>
</head>
<body>
    <ul>
        <li>HTML</li>
        <li>CSS</li>
        <li>JavaScript</li>
        <li>jquery</li>
        <li>HTML5</li>
        <li>CSS3</li>
        <li>ES6</li>
    </ul>
    <script type="text/javascript">
        //补充代码
        
        let list = document.querySelectorAll('li');
        for (let i = 0; i < list.length; i++) {

            let listinner = list[i].innerHTML;
            
            list[i].addEventListener('mouseover',function () {
               this.style.color = "red";
               let afterInner = "我是第" + (i + 1) + "个"
               this.innerHTML = listinner + afterInner;
            })
            list[i].addEventListener('mouseout', function () {
                this.style.color = "black";
                let afterInner = ' ';
                this.innerHTML = listinner + afterInner;
            })

            
        }
    </script>
</body>
</html>

麻烦帮忙看一下还有继续优化的地方么？

慕盖茨Bowring 2023-08-17

源自：初识 ES6 3-13 编程练习