jQuery get element height on window resize

Question

I am trying to get the height of a div tag on window resizing but I get always the same height. The event resizing is triggered correctly.

var resizeNews = this.resizeNews = function() {
    $('.top-news__pillar').each(function (index){
            console.log($(this).outerHeight());
            if($(this).outerHeight() > maxHeightPillar)  maxHeightPillar = $(this).outerHeight(); 
        });        

/if I don't set the height below the height correctly change when resizing/

     $('.top-news__pillar').each(function (index){
          $(this).outerHeight(maxHeightPillar);
        });
   }

    $(window).on('resize',resizeNews);

Answer 1

Try .outerHeight() instead of .height()

Answer 2

Try this code.

  $(document).ready(function() {
        $(window).resize(function() {
            var bodyheight = $('.top-news__pillar').height();
            console.log(bodyheight);
        }).resize();
    });

Answer 3

Yes, you will get always same height why because if you specify your top-news__pillar element height in fixed unit like px instead of responsive unit like `%.

Even if you resize also your element height will be same. If you mention the element height in % you can see the height change when you resize the window.