columns().visible() hiding column but not showing it again

I've previously been using column().visible() with the column index to toggle the hiding and showing of a column. However, as more columns and customisation has been added, it's become laborious to keep a track of the indexes, especially when columns are not added to the end of the table but in the middle.

To make it easier I've switched to columns().visible() as it enables me to select the column using a jQuery selector (which I don't think the former does?). After switching over, I now have a problem whereby I can hide the column when toggling the visibility from a dropdown, but it doesn't reappear when selected again.

Page:

https://webdev.brandnetics.co.uk/cm/assetzexchange/Bootstrap%204/Template/layout_4/LTR/default/full/browse-properties.html

JavaScript:

 var y = $('#tableBrowseProperties').DataTable({
        "responsive": {
            details: {
                type: 'none',
                display: $.fn.dataTable.Responsive.display.childRowImmediate,
                renderer: function (api, rowIdx, columns) {
                    var data = $.map(columns, function (col, i) {
                        return col.hidden ?
                            '<tr data-dt-row="' + col.rowIndex + '" data-dt-column="' + col.columnIndex + '">' +
                            '<td class="w-50"><strong>' + col.title + ':' + '<strong></td> ' +
                            '<td class="w-50 text-right">' + col.data + '</td>' +
                            '</tr>' :
                            '';
                    }).join('');

                    return data ?
                        $('<table id="dt-vertical-table" class="table table-striped w-100"/>').append(data) :
                        false
                }
            }
        },


        colReorder: true,


        "searching": false
    });

    y.columns([$("#th-capitalisation"), $("#th-ae-fee"), $("#th-yield-bid"), $("#th-yield-mid"), $("#th-price-bid"), $("#th-price-mid"), $("#th-return-bid"), $("#th-return-mid"), $("#th-update"), $("#th-discount-bid"), $("#th-discount-mid")]).visible(false);
    y.on('column-visibility.dt', function (e) {
        y.columns.adjust().draw();
    });

    
    $('div.toggle-vis').on('click', function (e) {
        e.preventDefault();

        // Get the column API object
        var attr = $(this).attr('data-column');
        var column = y.columns($(attr));
        

        // Toggle the visibility
        
        column.visible(!column.visible());
        y.columns.adjust().draw( false );
        $(this).children('label').children('.uniform-checker').children('span').toggleClass('checked');
    });
    
    $('div.toggle-offer').on('click', function (e) {
        e.preventDefault();
        var columns = y.columns([$('#th-price-offer'), $('#th-yield-offer'), $('#th-return-offer'), $('#th-discount-offer')]);
        
        columns.visible(!columns.visible());
        y.columns.adjust().draw( false );
        $(this).children('label').children('.uniform-checker').children('span').toggleClass('checked');
    });
    
    $('div.toggle-bid').on('click', function (e) {
        e.preventDefault();
        var columns = y.columns([$('#th-price-bid'), $('#th-yield-bid'), $('#th-return-bid'), $('#th-discount-bid')]);
        
        columns.visible(!columns.visible());
        y.columns.adjust().draw( false );
        $(this).children('label').children('.uniform-checker').children('span').toggleClass('checked');
    });
    
    $('div.toggle-mid').on('click', function (e) {
        e.preventDefault();
        var columns = y.columns([$('#th-price-mid'), $('#th-yield-mid'), $('#th-return-mid'), $('#th-discount-mid')]);
        
        columns.visible(!columns.visible());
        y.columns.adjust().draw( false );
        $(this).children('label').children('.uniform-checker').children('span').toggleClass('checked');
    });