function animateUsingClass(target, animClass, timeoutDuration) {
        var result  = new $.Deferred(),
            $target = $(target);

        timeoutDuration = timeoutDuration || 400;

        function finish(e) {
            if (e.target === target) {
                result.resolve();
            }
        }

        function cleanup() {
            $target
                .removeClass(animClass)
                .off(_transitionEvent, finish);
        }

        if ($target.is(":hidden")) {
            // Don't do anything if the element is hidden because transitionEnd wouldn't fire
            result.resolve();
        } else {
            // Note that we can't just use $.one() here because we only want to remove
            // the handler when we get the transition end event for the correct target (not
            // a child).
            $target
                .addClass(animClass)
                .on(_transitionEvent, finish);
        }

        // Use timeout in case transition end event is not sent
        return Async.withTimeout(result.promise(), timeoutDuration, true)
            .done(cleanup);
    }
Start an animation by adding the given class to the given target. When the
animation is complete, removes the class, clears the event handler we attach
to watch for the animation to finish, and resolves the returned promise.

@param {Element} target The DOM node to animate.
@param {string} animClass The class that applies the animation/transition to the target.
@param {number=} timeoutDuration Time to wait in ms before rejecting promise. Default is 400.
@return {$.Promise} A promise that is resolved when the animation completes. Never rejected.