Adding multiple views not working [Alloy]

Hello,

I'm trying to add multiple views to my window(with random positions) but when I am opening my application it only shows 1 view..

Here is my code

Index.XML:

<Alloy>
    <Window id="main" onOpen="spawnQuestion">
    </Window>
</Alloy>

function generateRandomNumber()
{
 
    var num = Math.floor(Math.random() * 400);
    return num;
}
 
function spawnQuestion(e)
{
 
    var question = Ti.UI.createView();
    for(i = 0; i <= 10; i++)
    {
 
        question.width = 30;
        question.height = 30;
        question.backgroundColor = "red";
        question.left = generateRandomNumber();
        question.top = generateRandomNumber();
        $.main.add(question);
    }
}
 
 
 
$.main.open();

And sometimes I even have these bugs: - No red squares - Really fast flashes of multiple red squares, faded and 1 is left