Efeito de escurecer (overlay) uma DIV com jquery

Eae pessoal, Tudo nos trinks?

Gostaria de saber com vocês q estão trabalhando a + tempo com jquery s é "possível" realizar efeito de escurecer tela em uma div dentro de outra quando o mouse estiver sobre ela (hover)?

Tenho a seguinte situação abaixo:

SCRIPT - A principio estou seguindo esse raciocinio

<script>
(function ($) {
$(".titulo").hide();

$(".content_overlay").mouseenter(function(){
$(".titulo").addClass("overlay");
$(".hover").fadeIn(400);

}).mouseleave(function() {
 $(".titulo").removeClass("overlay");

 });})(jquery); </script>

CSS

​.content_overlay{width:33%; display:inline-block; margin-bottom: -2px; position:relative; overflow:hidden;}

.overlay{width:100%; height:100%; display:block; background-color: rgba(0,0,0,0.5); top:0; position: absolute;}

HTML

<div class="content_overlay">
 <div class="overlay"><h1>Title</h1></div>
 <div class='img'><img src="img_teste.jpg"/></div>

</div>

<div class="content_overlay">
 <div class="titulo"><h1>Title</h1></div>
 <div class='img'><img src="img_teste.jpg"/></div>

​

</div>

<div class="content_overlay">
 <div class="titulo"><h1>Title</h1></div>
 <div class='img'><img src="img_teste.jpg"/></div>

​ </div>

O grande problema do código acima é q a class overlay esta sendo adicionada em todas as divs com a class titulo ao colocar o mouse sobre content_overlay e o que gostaria era que a class fosse adicionada apenas na div (class=titulo) em que o mouse estivesse sobre.

Ex.:
Ao colocar o mouse acima de content_overlay, a class overlay só será adicionada na div titulo q consta dentro dela.

-------------------

N sei s deu p entender ou estou viajando teria um jeito bem + prático de fazer isso.. quem puder me dar alguma orientação de como devo proceder serei grato!!!

Com css3 sei q seria + fácil.. mas estava tentando ver com Jquery.. caso encontre antes posto aqui.. Abraço