Post History

First, I would warn you that using JavaScript here isn't best practice. It won't work for people without JavaScript and it will slow down the site some even for people with JavaScript. If you can do it server-side, that would be better for the users.

That said, if you do want to do it with JavaScript, the best way would be to use [`insertAdjacentHTML()`](https://developer.mozilla.org/en-US/docs/Web/API/Element/insertAdjacentHTML).

To append the code snippets to the end of head and then the body:

```js
const headerCode = '<link rel="stylesheet" href="./css/mobile_general_structure.css"></link>';
const bodyCode =
`<div dir="rtl" class="main_box">
    <div class="phone_box">
        <a class="phone_link" href="https://wa.me/NUMBER">
	    <img class="phone_icon" src="./images/whatsapp.svg"></img>
	    <span class="phone_text">WhatsApp call</span>
        </a>
    </div>
</div>`;

document.head.insertAdjacentHTML('beforeend', headerCode);
document.body.insertAdjacentHTML('beforeend', bodyCode);
```

Embedding the HTML into the JS eliminates the need for a separate server call. Using a [template literal](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Template_literals) lets you put easily put line breaks in the code.