Jquery hide div partially
<p>I would like to adjust the width of the div using jquery on click event, and i can't seem to figure out what the exact syntax is.</p>

<p>below is an example of what i tried so far.</p>

<pre><code>$(function() {
    $("#square").on("click", function(){
        if($(this).css("width", "50")){
            $(this).animate({width:"500"}, 1000);
        } else {
            $(this).animate({width:"50"}, 1000);
        }
    });
});
</code></pre>

<p><a href="http://jsfiddle.net/4GGP8/" rel="nofollow">http://jsfiddle.net/4GGP8/</a></p>

<p>Thanks in advance.</p>
