jQuery deferredでfailが呼ばれない

jQueryのDeferredを使う下記コードを作成しましたが、400エラーの時にfailが呼ばれると思いましたが、consoleにGET http://localhost:3000/api/favorite?id=100 400 (Bad Request)とでて処理が実行されません。200,201の時はdoneが実行されます。

コード

$(function(){
    $(document).on('click', '#add-fav', function(){
        var id = $(this).data("id");
        addFav(id)
            .done(
                function(data){
                    Materialize.toast(data.name+'を登録しました', 3000);
                })
            .fail(
                function(err){
                    Materialize.toast(err.reason, 3000);
                }
            );
    });

    $(document).on('click', '#del-fav', function(){
        var id = $(this).data("id");
        delFav(id)
            .done(
                function(){
                    Materialize.toast("削除しました。", 3000);
                })
            .fail(
                function(err){
                    Materialize.toast(err.reason, 3000);
                }
            );
    });
});

// お気に入りを追加する。
function addFav(id){
    var defer = $.Deferred();
    $.ajax({
        url: "/api/favorite",
        type: "GET",
        data: {
            id: id
        },
        dataType: "json",
        success: defer.resolve,
        error: defer.reject
    });
    return defer.promise();
}

// お気に入りを削除する。
function delFav(id){
    var defer = $.Deferred();
    $.ajax({
        url: "/api/favorite",
        type: "DELETE",
        data: {
            id: id
        },
        success: defer.resolve,
        error: defer.reject
    });
    return defer.promise();
}

エラー時にfailが呼ばれるようにするにはどのようにすればいいのでしょうか。