jQuery动画()不工作

对不起，但我只是不能理解为什么它不工作。我一整天都在测试不同的东西。我怀疑我的jQuery来源不同，但在jSFiddle中测试给了我相同的结果。这应该很容易解决。我只是想要一个动画，当点击其中一个圆圈，从屏幕的右侧带来一个子菜单。

小提琴http://jsfiddle.net/YWTt2/14/

html部分主要是SVG的东西，所以没有什么可看的，下面是JavaScript部分，它都在jsfiddle。

//Function for opening submenus and animation
    $(document).on("click", "a[name='menu1']", function (e) {
    e.preventDefault();
    $("#menu1").css({visibility:"visible"});
        $("#menu1").animate({left:'550px'});
    //$("#menu1").slideDown(5110);
    });
      $(document).on("click", "a[name='menu2']", function (e) {
    e.preventDefault();
    $("#menu2").css({visibility:"visible"});
    });
    $(document).on("click", "a[name='menu3']", function (e) {
    e.preventDefault();
    $("#menu3").css({visibility:"visible"});
    });
    $(document).on("click", "a[name='menu4']", function (e) {
    e.preventDefault();
    $("#menu4").css({visibility:"visible"});
    });
     $(document).on("click", "a[name='menu5']", function (e) {
    e.preventDefault();
    $("#menu5").css({visibility:"visible"});
    });

     //Closes the open submenus
     $("#controlnav").on("click", function (e) {
    $("#menu1,#menu2,#menu3,#menu4,#menu5").css({visibility:"hidden"});
    });