Unable to animate a view?

I'm trying to animate a simple view so that the view goes from small to large but it doesn't seem to be working. Is it because animations don't work inside event listeners? Or do I need a module of any sorts? Thank you!

//create window
var win1 = Titanium.UI.createWindow({  
    title:'Tab 1',
    backgroundColor:'#fff'
});
 
//create a simple red view
var my_view =  Titanium.UI.createView({
    backgroundColor:'#f00',
    height:20,
    top:200,
    left:100,
    width:100,
});
 
//the button which will cause the animation to occur
var tabutton = Titanium.UI.createButton({
    title:'test',
    width:60,
    height:60,
    top:10,
    left:0,
});
 
//eventlistener, so when I click the button, the animation occurs
tabutton.addEventListener('onclick',function(e)
{
//the animation
my_view.animate({
 
    height:300,
    width:200,
    top:100,
    left:200,
 
});
 
});
 
//adding the button and view and opening the window
win1.add(my_view);
win1.add(tabutton);
win1.open();

Let me clarify a bit: When the app loads, the small red box shows (the one with height:20 and width:100) just fine. Then, when I click the "tabutton" nothing happens....