使用jQuery和Raphael在悬停时动画SVG路径

Question

当一个元素（a#blog）悬停时，我正试图在Raphael中为一段路径设置动画。我已经能够通过这个JS和fiddle：

来获得动画更改

var paper = Raphael(0, 0, 150, 150)
var pth = paper.path("M0 36L0 46L10 46" ).animate({path: "M0 16L0 46L10 46" }, 2000);
pth.attr({stroke: "#000", "stroke-width": "2"});

但是当我尝试使用jQuery将事件绑定到.hover（）时，它将无法运行。我可能做错了什么想法？这是JS和fiddle：

var paper = Raphael(0, 0, 150, 150)
var pth = paper.path("M0 36L0 46L10 46" );
pth.attr({stroke: "#000", "stroke-width": "2"});

$("#blog").hover(function () {
    pth.animate({path: "M0 16L0 46L10 46" }, 2000);
}, function() {
    pth.animate({path: "M0 36L0 46L10 46" }, 2000);
});

我发现拉斐尔文档有点难以解释，所以如果有人在那里有输入，那就很感激了！