I have a div that has some padding, border, and style applied to it. Inside the div I have just some plain text. Something like this:

<div id=test style="border: 2px solid black; background-color: blue;">
    The text I would like to animate
</div>

Normally to animate the contents I would do something like this:

$('#test > *').hide(1000);

But apparently the > * only selects child elements, and not non-elements (text for example)

So my current work around is:

<div id=test style="border: 2px solid black; background-color: blue;">
    <span>The text I would like to animate</span>
</div>

Making a span that is not really needed.