Edit in JSFiddle

var detectTransitionEvent   = function() {
    var element             = document.createElement('dummy');
    var events              = {
        'transition':       'transitionend',
        'OTransition':      'oTransitionEnd',
        'MozTransition':    'transitionend',
        'WebkitTransition': 'webkitTransitionEnd'
    };
    for(var event in events) {
        if("undefined" != typeof element.style[event]) {
            return events[event];
        }
    }
    return null;
};
$.fn.transitionEnd      = function(callback) {
    var $this           = $(this);
    var event           = detectTransitionEvent();
    return $this.unbind(event).one(event, callback);
};

$('button').click(function() {
    $(this).transitionEnd(function() {
        $('body').append('<br />transition ended');
    });
    $(this).toggleClass('wide');
});

<button>Click me</button>

button {
    width: 100px;
    transition: all 0.5s linear;
}
button.wide {
    width: 200px;
}