Jquery get height of auto height element

I have found a workaround for doing a transition with ease-in AND ease-out. This workaround needs the "jump" of the element:

var elementselector = "#elementtoscroll";
$(elementselector ).css("height", "auto");
var elemheight = $(elementselector).css("height");
$(elementselector).css("height", "0");
$(elementselector).css("height", elemheight);

This way, javascript gets the height - I know it's not a beuatiful way, but it works. This is important for example for the ease-out effect.

EDIT: It should be said, that this is just possible with CSS3 and a CSS-Style like this:

#panel{
    background-color: #FF00FF;
    display: block;
    height: 0px;
    transition: all 300ms ease-in-out;
    overflow: hidden;
}

please check you try to get height when DOM is ready, that is to say in the window.onload function.

In case your div element is empty and height is auto, it will return 0. So your div is likely to be empty before full page is loaded.

For example : I want to remember initial heights for my .elementDiv divs :

var initialHeight = [];
window.onload = function() {
$('.elementDiv').each(function(i) {
  initialHeight[i]=$(this).height();
  });
  // then use it
  }

When not in the onload function, the heights I get are all 0.

I hope this was the reason, because I don't see anything else..

I had this same problem and found the solution here: http://www.fortwaynewebdevelopment.com/jquery-width-or-height-always-returns-0-fix/

When I'm using jQuery, I like to stick to it as much as I can for consistency's sake.

Actually both solutions - using window.load(){} or $("my element").load(){} worked beautifully for me so I hope this can help you out as well or anyone else finding this issue.