Not able to use Responsive event

I use DataTable with raw HTML.

Currently, I am trying to catch the .on('responsive-display') event.

This is my method:

I instantiate the DataTable in a file:

$('#DataTables_Table_0').DataTable({
    responsive: {
        details: {
            type: 'column',
            target: 'tr'
        }
    }
});

In another file, I try to log when a row opens itself to reveal more content:

$('#DataTables_Table_0').dataTable().api().on('responsive-display', function (e, datatable, row, showHide, update) {
    console.log('Details for row ' + row.index() + '' + (showHide ? 'shown' : 'hidden'));
});

In also tried:

$('#DataTables_Table_0').DataTable().on('responsive-display', function (e, datatable, row, showHide, update) {
    console.log('Details for row ' + row.index() + '' + (showHide ? 'shown' : 'hidden'));
});

and

$('#DataTables_Table_0').dataTable().on('responsive-display', function (e, datatable, row, showHide, update) {
    console.log('Details for row ' + row.index() + '' + (showHide ? 'shown' : 'hidden'));
});

When I click on a row to open it, it does not log anything. I think I'm using wrongly this plugin.

If you have any clue, please share it!