jQuery on click event not working with datatables

Question

I am using jquery datatables plugin. Each row has two action buttons to confirm or cancel the item in the table.

I am getting problem to add on click event for both of them. Buttons added directly into the json data.

(function ($){
    $(function (){

        let confirm_button = $('.gs-confirm-order');
        let cancel_button = $('.gs-cancel-order');
    
    
        // cancel order process
        cancel_button.on('click', function (){
            if (confirm('Are you sure you want to cancel this order? Undo is not possible.')) {
            console.log('Item cancelled.');
            } else {
            console.log('Operation cancelled.');
            }
        });
    });
})(jQuery);

within the document ready also not working

(function ($){
    $(document).ready(function (){
        let response_alert = $('#response');
        response_alert.hide();

        let confirm_button = $('.gs-confirm-order');
        let cancel_button = $('.gs-cancel-order');

        // cancel order process
        cancel_button.on('click', function (){
            if (confirm('Are you sure you want to cancel this order? Undo is not possible.')) {
                console.log('Item cancelled.');
            } else {
                console.log('Operation cancelled.');
            }
        });
    });
})(jQuery);