dojox.gfx - Maintaining gfx references for event connection

Question

I have a simple program where I am GETing an svg file and then creating gfx shapes from rect elements within the svg as follows

function superCallback(shape){ 

  shape.setFill("red"); 

  } 

  dojo.ready(function() { 

                    // Load image 
                    dojo.xhrGet({ 
                            //handleAs: 'xml', 
                            url: 'svg/demo.svg', 
                            load: function(data) { 

                                    // Create the surface 
                                    var surface = dojox.gfx.createSurface("logoHolder", 2000, 1500); 


                                    var group = surface.createGroup(); 



                                    var dom = dojox.xml.parser.parse(data); 

                                    rects = dom.getElementsByTagName("rect"); 

                                    for (var idx = 0 ; idx < rects.length ; idx++) { 

                                            //alert('Coordinates ' + rects[idx].getAttribute("x") + ', ' + rects[idx].getAttribute("y")); 

                                            var rectangle = group.createRect({ x: parseFloat(rects[idx].getAttribute("x")), 
                                                                                                                     y: parseFloat(rects[idx].getAttribute("y")), 
                                                                                                                     width: parseFloat(rects[idx].getAttribute("width")), 
                                                                                                                     height: parseFloat(rects[idx].getAttribute("height")) }) 
                                                                                                                     .setStroke({ style: "Solid" , width: "7" , color :"black"}); 



                                              rectangle.connect("onclick",dojo.hitch(rectangle,function(e) { 
 superCallback(rectangle); 
                                                                                                                              })); 

} 

}); 
}); 

As can be seen, I am using a local variable rectangle to create and store the gfx shape and then calling connect to attach an event to it.

The problem is that the event is attached to only the last gfx rect which is created in teh for loop because I guess the closure is executing in the context of the last rectangle reference always.

Need some help in fixing this so that all rects can be triggered by the event

Thanks in advance

Regards Shyam