Should I use an array or just simplify this code with startwith and strings in Jquery? Rookie -

I'm just starting with javascript / jQuery and I think the syntax is still a bit heavy. Writing some lines of code takes some time I was wondering if you can tell me in the right direction to make this code more clever, to set vertical alignment of div Like the code below, if I tried to create an array, then to store the value, repeat i ++ and then math, but I had problems finding the right syntax for doing this work . I also do not believe that if two arrays together have a good structure to calculate 5 different values. I tried:

  $ ('[id ^ = # tr1]'). CSS ({top: ratio + '%'});   
 and then:  
  var buttonhit = $ this.height   
 and then I do it to Trying the other  div  I will start again tomorrow morning and will read a bit more, but I thought someone can give me some help here My code works so it is not necessary, but I do I want to learn properly    Function Set AbstractProject () {var button 1Hight = $ ("# buttonbg1"). Height (); Var button 2 height = $ ("# buttonbg2"). Height (); Var button3 heitt = $ ("# buttonbg3"). Height (); Var button 4 height = $ ("# buttonbg4"). Height (); Var button 5 height = $ ("# buttonbg5"). Height (); Var text1height = $ ("# tr1"). Height (); Var text2height = $ ("# tr2"). Height (); Var text3height = $ ("# tr3") height (); Var text4height = $ ("# tr4") height (); Var text5height = $ ("# tr5"). Height (); Var ratio 1 = 50 - ((text1 high -1) / button1 height / 2 * 100); Var ratio 2 = 50 - ((text2height-1) / button 2 heights / 2 * 100); Var ratio 3 = 50 - ((text3height-1) / button 3 heights / 2 * 100); Var ratio 4 = 50 - ((text4height-1) / button 4 hect / 2 * 100); Var ratio 5 = 50 - ((text 5 high -1) / button 5 height / 2 * 100); $ ("# Tr1"). CSS ({top: ratio 1 + '%'}); $ ("# Tr2"). CSS ({top: ratio 2 + '%'}); $ ("# Tr3"). CSS ({top: ratio 3 + '%'}); $ ("# Tr4"). CSS ({top: ratio4 + '%'}); $ ("# Tr5"). CSS ({top: ratio5 + '%'}); }    
 
 
 Whenever something seems to be repeated, it is normally .. thoughts Do:   For  (var i = 1; i & lt; = 5; i ++) {// i in [1,5] var button knight = $ ("#buttonbig "+ I). height (); Var texthit = $ ("# tr" + i). height (); Var ratio = 50 - ((textHeight-1) / button high / 2 * 100); $ ("#tr" + i) Css ({top: ratio + '%'}); }   
 Note that there is no need to use any array in this situation because all values ​​are the direct function of  i .  
 Also, I have not really tried to accomplish this, therefore, to achieve the same goals in pure CSS / without the use of Java  without  May be a good / accepted way.