jQuery - Animate (Opacidade)

Eai pessoal, gostaria de aplicar o efeito de transparência em uma div sem utilizar imagem, então estou utilizando o jQuery para isso:

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$("#teste").animate({ opacity: 0.5 }, 0 ); });
</script>

<style type="text/css">

body { background:#333; margin:20px; padding:0; } #teste { background:#FFF; padding:10px; } #teste span { display:block; }

</style>

<div id="teste">
<span>Testando</span>
<span>Testando</span>
<span>Testando</span>
<span>Testando</span>
<span>Testando</span>
</div>

No exemplo estou aplicando uma opacidade de 50% na div teste, mas o efeito é aplicado também em todos os elementos que estão dentro da div. Tem como limitar para que o efeito seja aplicado apenas no bloco da div ?

Obrigado!