Lost focus after filter

[awariat]

I implemented simple-datatables in my WordPress plugin. Unfortunately, after filter rows and next clear filter, the inputs and buttons recreated stop working. Here is the code I try to repair:

// Add inline script to initialize DataTable after DOM is loaded
wp_add_inline_script('simple-datatables-js', "
document.addEventListener('DOMContentLoaded', function() {
    const table = new simpleDatatables.DataTable('#example', {
        // Trigger this after each DataTable update (search, pagination, etc.)
        afterUpdate: function() {
            bindButtons(); // Re-bind buttons after table update
            handleFocus(); // Ensure focus behavior is applied
        }
    });

    // Function to bind buttons to the rows
    function bindButtons() {
        // Decrease quantity
        document.querySelectorAll('.btn-down').forEach(button => {
            button.removeEventListener('click', handleDecrease); // Remove existing listeners to avoid duplicates
            button.addEventListener('click', handleDecrease);   // Add new listener
        });

        // Increase quantity
        document.querySelectorAll('.btn-up').forEach(button => {
            button.removeEventListener('click', handleIncrease); // Remove existing listeners to avoid duplicates
            button.addEventListener('click', handleIncrease);    // Add new listener
        });
    }

    // Decrease quantity handler
    function handleDecrease(event) {
        const inputField = event.target.closest('tr').querySelector('.qty-input');
        let quantity = parseInt(inputField.value, 10);
        if (!isNaN(quantity) && quantity > 0) {
            quantity--; // Decrease by 1
            inputField.value = quantity;
        }
    }

    // Increase quantity handler
    function handleIncrease(event) {
        const inputField = event.target.closest('tr').querySelector('.qty-input');
        let quantity = parseInt(inputField.value, 10);
        if (!isNaN(quantity)) {
            quantity++; // Increase by 1
            inputField.value = quantity;
        }
    }

    // Focus and select all text in the input fields
    function handleFocus() {
        document.querySelectorAll('.qty-input, .price-input').forEach(input => {
            input.removeEventListener('focus', selectText); // Remove any previous listeners
            input.addEventListener('focus', selectText); // Add focus listener
        });
    }

    function selectText(event) {
        event.target.select(); // Select all text in the input field
    }

    // Handle the custom search input
    const searchInput = document.querySelector('.datatable-search input'); // Updated selector for your custom search input
    searchInput.addEventListener('input', function() {
        table.search(this.value); // Perform search with custom search input
    });

    // Initial binding when the page is loaded
    bindButtons();
    handleFocus(); // Set up focus for inputs initially
});
");

I would like my up and down buttons and focus to work afte clear filter
Kind regards
Jack

[awariat]

How to delete this?
Sorry I found it working now:

document.addEventListener('DOMContentLoaded', function() {
    const table = new simpleDatatables.DataTable('#example');
    
    // Rebind buttons and ensure focus is applied after table update (search, pagination, etc.)
    table.on('datatable.update', function() {
        bindButtons();  // Re-bind buttons after update
        handleFocus();  // Ensure focus behavior for inputs
    });