按索引定位元素？

Question

我知道我可以用更少的函数来完成同样的事情，但我无法弄清楚如何专门针对#twitter，＃facebook和#mail divs，就像我对#carrier divs一样。这是JS：

$('div.fb, div.tw, div.mail, div.tmobile, div.att, div.verizon, div.unlocked').click(function(){
    var clicked = $(this);
    var index = $(this).closest('div').index();
    $('#test-wrapper').fadeIn('fast', function(){
        if (clicked.hasClass('tmobile') || clicked.hasClass('att') || clicked.hasClass('verizon') || clicked.hasClass('unlocked')) {
            $('#carrier div').not(".close").eq(index).animate({"top": "+=524px"}, 500, function(){
                $(this).animate({"top": "-=24px"}, 200);
            });
        } else if (clicked.hasClass('mail')){
            $('#mail').animate({"top": "+=255px"}, 500, function(){
                $(this).animate({"top": "-=20px"}, 200);
            });
        } else if (clicked.hasClass('tw')){
            $('#twitter').animate({"top": "+=102px"}, 500, function(){
                $(this).animate({"top": "-=20px"}, 200);
            });
        } else {
            $('#facebook').animate({"top": "+=345px"}, 500, function(){
                $(this).animate({"top": "-=20px"}, 200);
            });
        }
    });
});

这里是JSFiddle：http://jsfiddle.net/yT9yg/（不要担心丢失的图像 - 它们现在存储在本地 - 或格式化，因为我还没有做任何媒体查询。）