Change height of div on click with jquery

Question

I'm trying to expand the height of a div element with the following code:

html:

<div id="expandbtn">more..</div>

<div id="portfolio"><div class="itemweb" title="lol" rel="#derp"><div class="thumb"><img src="images/items/skills.jpg" title="Skills" rel="#derp"/></div>

script:

$('#expandbtn').click(function(){
$('#portfolio').animate({height:'72px'}, 500);});

css:

#portfolio {
width:914px;
height:295px;
margin:0 0 0 -8px;
overflow:hidden;}

But it won't work. What am i doing wrong?

Answer 1

your code is just fine. you can also try

$('#portfolio').css("height","74px");

try putting some backgroung color or image to visualize clearly

fiddle : http://jsfiddle.net/49HQM/4/

Answer 2

Try toload it when the document is ready:

  $(document).ready(function(){
      $('#expandbtn').click(function(){
      $('#portfolio').animate({height:'72px'}, 500);
   });