How would I format this JavaScript code so it's more readable

How can I format this code so it's more readable?

$(".card").click(function(){
        $(this).stop().animate({ 
            width:'0px', 
            marginLeft: margin+'px', 
            opacity: 0.5}, 
            500, 
            function(){
               $(this).siblings('.card').animate({
                   width: width + 'px',
                   marginLeft:'0px',
                   opacity:'1'},500);
            });         
});

This is a very subjective question

I am a fan of separating things so each is identifiable and easily maintained in the future. However some will argue this does lead to more code, but more readable code in my opinion.

var animateCallback = function() {
    var props = {
        width: width + 'px',
        marginLeft: '0px',
        opacity: '1'
    };
    $(this).siblings('.card').animate(props, 500);
};
var clickHandler = function() {
    var props = {
        width: '0px',
        marginLeft: margin + 'px',
        opacity: 0.5
    };
    $(this).stop().animate(props, 500, animateCallback);
};
$(".card").click(clickHandler);

StackExchange Code Review Q#14621, answer score: 4