Проблема с $(document).on('click'…)

Шаблон подгружаются аяксом. В шаблоне таблица и есть кнопки <button type="button" class="btn btn-sm btn-icon btn-default">...</button>. При нажатии на одну из этих кнопок, на нажатую кнопку ставится класс btn-success. Но перед этим надо проеверить, есть ли у кнопки атрибут disabled. И проверка не проходит.

var SetMainImage = function () {
    var $btnMainImg = jQuery('[data-btn-img-main]');
    jQuery(document).on('click', '[data-btn-img-main]', function () {
        var $this = jQuery(this);
        console.log($this);
        if($this.prop('disabled', false))
        {
            $btnMainImg.prop('disabled', false);
            $btnMainImg.removeClass('btn-success').addClass('btn-default');
            var $imgId = $this.parent().parent().data('product-img-id');
        }
    })
};

Проверка не происходит потому что jQuery(this) это массив, а в нем обьект нажатой кнопки.

Если обратиться как к массиву jQuery(this)[0], то возвращается только html а не обьект jQuery. Как получить нажатую кнопку как обьект jQuery?

UPD: Я убрал $btnMainImg и код теперь выглядит так

var SetMainImage = function () {
    jQuery(document).on('click', '[data-btn-img-main]', function () {
        var $this = jQuery(this);
        console.log($this);
        if($this.prop('disabled', false))
        {

        }
    })
};

И всеравно массив,а не объект нажатой кнопки