javascript - setInterval in for loop for implementing fade in

I have implemented the following code for fade in by changing the opacity value, which is working so far, but not sure why we need the curOpacity to hold the value outside,

working code

for(let i=0;i        var curOpacity = 0;

        (function(index){
            setInterval(function(){
                curOpacity += 0.1;
                squares[index].style.opacity = curOpacity;
            }, 200)
        })(i);
    }

I did not use curOpacity variable at 1st time, and it is not working, could you please tell me the reason and which topic related to that?

Not working code,

for(let i=0;i    (function(index){
        setInterval(function(){
            squares[index].style.opacity += 0.1;

        }, 200)
    })(i);
}