Why is Squarespace changing anchor target upon reload and jumping to top?

Am a coding newbie. I have a web site of Squarespace 7.0 and want to show / hide an embedded code when the site visitor clicks a button.

To accomplish that I've included a button having a link targeting to "#show-more". Code injection to header of page binds this to a function that toggles visibility of the block.

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.7.0/jquery.min.js"></script>
<script>
$(document).ready(function(){  
  // Load More
  $('a[href="#load-more"]').click(function(){
    $("#block-yui_3_17_2_1_1726217207010_54845").toggleClass("show");
    }
  );
});
</script>

Toggling visibility works as intended, but while reloading the squarespace site replaces the given anchor with a different anchor target and reloads to top of the page. The user will need to scroll down again and will likely feel annoyed.

I would like the user to stay on the same area of the site. Any suggestion how to fix this? 

I found a workable solution by setting an anchor nearby and adjusting the href to point to that anchor directly. 

It's not a nice solution, but it's good to go.