Map onrollover issue

[nick.marshal]

var sname1 = "StateName1"; //but1
var sname2 = "StateName2";   //but2
for (var i:Number = 1; i<=2; i++) {
	this['but'+i].onRollOver = function (){
			trace(i);  //this i comes out to be 3 
			trace(this['sname'+i]);
			bubble_mc._visible = true;
			bubble_mc.text = this['sname'+i];
		}
		
	this['but'+i].onRollOut = function (){
			//trace(sname);
			bubble_mc.text = "";
			bubble_mc._visible = false;
		}	
}

The bubble_mc.text comes out to be undefined. Also the trace(i) is returning 3 on hover whereas it should give 1 or 2 right ? I am doing something wrong here as i have been out of practice for sometime. Please help.

[Prid]

Common issue, READ THIS

Solution:

var sname1 = "StateName1"; //but1
var sname2 = "StateName2";   //but2
for (var i:Number = 1; i<=2; i++) {
    btnClick(this['but'+i]);
}

function btnClick(btn){
    btn.onRollOver = function (){
            trace(i);  //this i comes out to be 3 
            trace(this['sname'+i]);
            bubble_mc._visible = true;
            bubble_mc.text = this['sname'+i];
        }
        
    btn.onRollOut = function (){
            //trace(sname);
            bubble_mc.text = "";
            bubble_mc._visible = false;
        }
}