Change Y position for array output

Question

Simple question for the pros.. I'm want to ouptut array items, and change y position. I'm missing something. The output is on the same line. Here is my Jsfiddle. Thanks for the help.

var s = new Kinetic.Stage({container: 'toolpanel', width:500, height:700});

var l = new Kinetic.Layer();

var cp3 = new Kinetic.Rect({x: 100,y: 10,width: 400,height:700, stroke:'black'});
l.add(cp3);

var desc = new Kinetic.Text({x: cp3.getWidth()/ 2,y: 20,text: 'Your Personalization',fontSize: 16,fontFamily: 'arial',fill: 'black',padding: 4});
l.add(desc);


s.add(l);


var odesc = [];
odesc.push("Glove Type:_20");
odesc.push("Glove Series:_40");
odesc.push("Glove Positons:_60");


for (var s = 0; s < odesc.length; s++){
     var db = odesc[s];
     var sdb = db.split("_");
     var text = sdb[0];
     var ly = 0;
     var label = new Kinetic.Text({ 
         x: 100, 
         y: ly+=20, 
         text: text, 
         fontSize: 16 ,
         fontFamily: 'arial', 
         fill: 'black', 
         padding: 1, 
         align: 'left'
     });
   l.add(label); ly += 10;

} l.draw();

Answer 1

This will help you

Move var ly = 0; above for loop. Currently it's taking y position for all the text as 50 that is the reason all the text are messed up.

DEMO