I am trying to make text-opacity of a label to 0 (not visible). I have the following script but it produces an error, Uncaught Error: Style is not done loading. Seems this is the error forcing the error from below; map.setPaintProperty('natural-point-label', 'visibility', 'none');

$( document ).ready(function() {

const bounds = [
    [129.000000,30.000000], // Southwest coordinates
    [146.000000,47.000000] // Northeast coordinates
];

myToken = 'snip';
//const xyx = new mapboxgl.LngLatBounds([-73.9876, 40.7661], [-73.9397, 40.8002]);
mapboxgl.accessToken = myToken;

const map = new mapboxgl.Map({
    container:  'map', // container ID
    style:      'mapbox://styles/someusername/cl5dpj234215p8bfdr6iz7', // style URL
    zoom:       4, // starting zoom
    //maxBounds: bounds, // Set the map's geographical boundaries.
    center:     [ 137.70263671875, 38.39333888832238], // starting position [lng, lat]
    //pitch:      60,
});

map.setPaintProperty('natural-point-label', 'visibility', 'none');

map.addControl(new mapboxgl.NavigationControl());

map.addControl(new mapboxgl.GeolocateControl({
    positionOptions: {
        enableHighAccuracy: true
    },
    trackUserLocation: true,
    showUserHeading: true
}));

// Add the control to the map.
map.addControl(
    new MapboxGeocoder({
        accessToken: mapboxgl.accessToken,
        mapboxgl: mapboxgl
    })
);

});

I am loading the files in the correct order:

<script src="https://api.mapbox.com/mapbox-gl-js/v2.9.1/mapbox-gl.js"></script>
<script src="https://api.mapbox.com/mapbox-gl-js/plugins/mapbox-gl-geocoder/v5.0.0/mapbox-gl-geocoder.min.js"></script>
<script src="https://development.example.com/user_public/ski/js/ski.js"></script>

I am also checking to ensure jquery has loaded.

I have also tried to do this;

    map.on("load", function() {
       map.setPaintProperty('natural-point-label', 'visibility', 'none');
    }); 

Any pointers much appreciated.