first store heights form mutliple divs in array and second apply them to other elements

Question

this is what i want to achieve:

(1) store heights from multiple divs (in an array?).

(2) apply these heights to other elements. first element gets the first value, second element gets the second value of the array …

this is what i have done to (1):

var arr = [];
i = 0;
$('.project').each(function(){
  projecthheights = $(this).height();
  arr[i++] = projecthheights;
});

now what do i have to do for step (2)? this is certainly the wrong way ;)

$('.horizontalimage').each(function(){
 $(this).css('height',projecthheights);
});

Answer 1

You already filled that array right..? Now Try to use the index parameter of .each() function,

$('.horizontalimage').each(function(i){
 $(this).css('height',arr[i]);
});

Additionally you can fill that array by using .map() along with .get() like below,

var arr = $('.project').map(function(){
             return $(this).height();
          }).get();

Answer 2

Here is your answer.

var i=0;
$('.horizontalimage').each(function(){
$(this).css('height',arr[i++]);
});

Declare the array globally.