[Code Injection] Language Switch Button doesn't work on mobile

Hello Squarespace community,

I hope you're all doing well! I am seeking some assistance with a coding injection issue I am facing on the mobile version of my website. Specifically, I am having trouble getting the code for my language change button to work properly.

On the desktop version of my site, the language change button functions perfectly fine. However, when it comes to the mobile version, it doesn't seem to respond or trigger the expected behavior. I have tried several approaches, but none have yielded the desired result.

I would greatly appreciate it if someone could guide me on how to correctly implement the code for the language change button on the mobile version of my Squarespace website. I am using the Squarespace platform for my website, and any advice or suggestions would be extremely helpful.

Here's the code I currently have for the language change button :

<script>
var container = document.createElement("div");
container.classList = "header-actions-action header-actions-action--cta preFade fadeIn"
container.setAttribute("data-animation-role", "header-element")
container.setAttribute("style", "transition-timing-function: ease; transition-duration: 0.4s; transition-delay: 0.02")

var link = document.createElement("a");
link.classList = "btn btn--border theme-btn--primary-inverse sqs-button-element--primary";
link.setAttribute("id", "monBouton");
link.setAttribute("style", "color: black; background-color: white; border: 2px solid black; padding: 20px 37.41px; text-decoration: none; cursor: pointer;");
  
<!-- replace "YOUR_URL_LINK_HERE" -->
link.setAttribute("href", "https://www.en.simonsonlandscape.com/")
link.setAttribute("target", "_self")
  
link.onmouseover = function() {
    this.style.backgroundColor = 'black';
    this.style.color = 'white';
}

link.onmouseout = function() {
    this.style.backgroundColor = 'white';
    this.style.color = 'black';
}

<!-- replace "ENGLISH" -->
var linkText = document.createTextNode("ENGLISH");
link.appendChild(linkText);
container.appendChild(link);

var neighbour = document.querySelector(".header-display-desktop .header-actions--right div:last-child");
var neighbourParent = document.querySelector(".header-display-desktop .header-actions--right")
neighbourParent.insertBefore(container, neighbour);
</script>

Thank you all in advance for your time and assistance. I'm looking forward to your valuable insights and suggestions !

Hi,

What is your site url?

Hi,

Thank you for answering my question
https://www.simonsonlandscape.com/

22 hours ago, BenBill said:

Hi,

Thank you for answering my question
https://www.simonsonlandscape.com/

You mean the English button doesn't appear on Mobile overlay menu, above mobile button?

Yes, that's it
I did it, sometimes ago for the desktop and it was already out of my understanding