Animate div opacity on page load jQuery

I have a jQuery slideshow where when a thumbnail is hover开发者_运维知识库ed over the picture changes and a description of the picture shows up in the larger version of the picture. All of that works fine. I would like, however, to change the opacity of the div that contains the description of the picture (because it's overlaid on top of the larger picture).

I don't know why the below code isn't working.

<script type="text/javascript">
$(document).ready(function () {

$('#description').animate({opacity: 0.25},1000});
});

</script>

The selector is correct. Thanks for any help

---

Maybe use fadeTo?

$('#description').fadeTo(1000, 0.25);

DEMO

---

try this:

$(document).ready(function () {

    $('#description').animate({opacity: 0.25},1000);
     //the error is in that } after the 1000 that you have

});

fiddle: http://jsfiddle.net/maniator/QfjNb/