jQuery属性选择器不起作用

Question

我的html中有以下元素：

<button id="btn-confirm-cancel-22" type="button" class="font-size-large" data-toggle="modal" data-target="#cancelProposalConfirationModal" data-cancel-rid="22">Cancel</button>

这个jQuery函数：

$("[data-cancel-rid]").on('click', function (event) {
    var request_id = $(this).attr('data-cancel-rid');
    console.log(request_id);
});

单击按钮时，浏览器不会调用jQuery函数。为什么???