Edit in JSFiddle

$( 'span' ).animate({ 
    'width': 300
},
{
    duration: 1000,
    step: function(now, fx) {
        // Change color to red when the animation is halfways done
        if( fx.pos > 0.5 ){
            $( this ).addClass( 'red' );
        }
        
        // Show how much of the animation has been completed
        $( fx.elem ).text(Math.floor(fx.pos * 100) + '%');
    }
});