Overflow hidden not working with jQuery .css click event -

i'm assigning overflow: hidden not seem work

jsfiddle

html

<ul class="list-container">     <li>items items</li>     <li>items items</li>     <li>items items</li>     <li>items items</li>     <li>items items</li>     <li>items items</li>     <li>items items</li>     <li>items items</li>     <li>items items</li> </ul> <a href="#" class="hide_list">hide list</a> 

jquery

$('.hide_list').click(function() {         $('.list-container').animate({width: "2px"});         $('.list-container').css("overflow","hidden");     }); 

i trying achieve slide shut effect on div. if there way it, i'm not sure why isn't working though.

try swap them.

$('.hide_list').click(function() {     $('.list-container').css("overflow","hidden");     $('.list-container').animate({width: "2px"}); });