jQuery animate promise

HTML

<div class="anim"></div>

CSS

.anim {
    width: 100px;
    height: 100px;
    position: absolute;
    top:0px;
    left: 0px;
    border: solid 1px black;
}

JavaScript

var promise = panimate('.anim', 1500, {
    left: '500'
});
promise.done(doTheNextThing);

function panimate(elm, time, props) {
    alert("panimate");
    var deferred = $.Deferred();

    $(elm).animate(props, time, function () {
        deferred.resolve();
    });

    return deferred.promise();
};

function doTheNextThing() {
    alert("done!");
    promise = panimate('.anim', 1500, {
        left: '10'
    });
    promise.done();
}