functions with button.click() are not executing the click part

Question

I have 2 function as below:

<script type="text/javascript"> 
    
    sm=()=>{
        
        document.getElementById('show').click()
        console.log('show')
    }

    hm=()=>{
        document.getElementById('hide').click()
        console.log('hide')
    }
    
</script>

When the functions are called they do get executed (cause i can see the console.log) but the button click never gets executed. although when I tried the below jQuery the sm() got executed with all its lines(including the click)

$("#ss").ready( function(){
        document.getElementById('show').click()
        console.log("show")
    });

the whole idea is that I want to show a modal when the page starts loading (with loading spinner) and then when the page is fully loaded (including getting database data and inserting them into a table). the modal gets automatically hidden i prefer vanilla js rather than jquery