mouseover y mouseout con Jquery

[Dundee]

Cada vez que tengo que lidiar con javascript me vuelvo loco (una , un . o cualquier cosa es muy dificil de depurar), soy programador de PHP y la verdad q me cuesta enfrentarme a depurar el código js (si alguien me puede decir como depurarlo estaría muy agradecido).

Voy al grano:
el tema es que por mucho q reviso este código no veo que esta mal:

Se me olvidó poner antes el html: (cada imagen tiene una clase distinta)

<img class="estudio" src="images/stories/boton_1.png" border="0" />

Código:

// JavaScript Document
$(document).ready(function(){
//alert('holaaa'); (esto si funciona si lo descomento)

 $(".estudio").mouseover(function() {
		alert('dentro');
    var src_img="../images/botones/boton_1.png";
	$(".estudio IMG").attr("src",src_img);
  }).mouseout(function(){
	  alert('fuera');
    var src_img="../images/botones/boton_1_bis.png";
	$(".estudio IMG").attr("src",src_img);
  });


 $(".ahorro").mouseover(function() {
    var src_img="../images/botones/boton_2.png";
	$(".ahorro IMG").attr("src",src_img);
  }).mouseout(function(){
    var src_img="../images/botones/boton_2_bis.png";
	$(".ahorro IMG").attr("src",src_img);
  });

 $(".proyecto").mouseover(function() {
    var src_img="../images/botones/boton_3.png";
	$(".proyecto IMG").attr("src",src_img);
  }).mouseout(function(){
    var src_img="../images/botones/boton_3_bis.png";
	$(".proyecto IMG").attr("src",src_img);
  });
 
});

He probado cambiando las rutas de las IMG (por si estaban mal), pero sigue sin funcionar, y he probado con un alert('holaaaa') al principio del doument.ready para comprobar que al menos estaba bien llamado desde el index (y esto si funciona).

Otra duda:
¿La ruta de las IMG tiene que tomarse desde el archivo javascript externo o desde el index.php desde el que lo llamo?.

Mil gracias por la ayuda de antemano.