如何在jQuery中对div进行动画处理，但该div中包含div？

Question

My English is bad, but I'll try to explain. I really need, help. I want to make animation with div, so div height change from 0px to height 500px:

$(".link").click(function(){
   $("#container").animate({height: '500'}, 1000);
});

but my problem is that div #container contains 5 more divs, and when i make this code, it doesnt work because of those 5 divs. When I delete those 5 divs it works. How to make it to work with those 5 div in that div #container.

Plese, help. Thanks.

Answer 1

try this solution

HTML

<a class="link">button</a>

<div id="container">
    <div>1</div>
    <div>1</div>
    <div>1</div>
    <div>1</div>
    <div>1</div>
</div>

JS

$(".link").click(function () {
    $("#container").animate({
        height: '200'
    }, 1000);
});

CSS

#container {
    height:0;
    background: red;
    overflow: hidden;
}
#container div {

}