How to get height of element in JQuery and use it in animate

var oldHeight = $("#outerCart").height;
        $('#outerCart').animate(
                    { height: (oldHeight + 100) }, {
                        duration: 'slow',
                        easing: 'easeOutBounce'
                    });

Right now this code does not work (the culprit im guessing is putting oldHeight for the new Height). Putting a constant like this will work

var oldHeight = $("#outerCart").height;
        $('#outerCart').animate(
                    { height: 200 }, {
                        duration: 'slow',
                        easin开发者_JS百科g: 'easeOutBounce'
                    });

How do i make this dynamic. Thanks in advance

You can just do "+=100" instead.

$('#outerCart').animate(
 { height: '+=100' }, {
     duration: 'slow',
     easing: 'easeOutBounce'
 });

From the docs for the animate()^(docs) method :

Animated properties can also be relative. If a value is supplied with a leading += or -= sequence of characters, then the target value is computed by adding or subtracting the given number from the current value of the property.

The reason your code didn't work was that you referenced the function without calling it.

$("#outerCart").height;

should have been:

$("#outerCart").height();