Hiding div on ready
<p>This hide/show script currently loads the div as visible when the page is downloaded. What do I change in the script so the #box div begins as hidden?</p>

<pre><code>$(document).ready(function () {
var hidden = false;
$('.arrow').click(function () {
    if (hidden) {
        hidden = false;
        $('#box').slideDown("slow");
    } else {
        hidden = true;
        $('#box').slideUp("slow");
    }
});
});
</code></pre>
