How to handle common code in multiple HTML's using javascript or jQuery

Question

I have an application which has almost 30 html\'s and they share some common code to which i f i made any changes i need to change it on every page. Below is the piece of code w

Answer 1

Old thread, but came across this requirement myself. My requirement was to do it in the client side with plain javascript. One off case, that is, only one html (appHeader.html) as common code.

In each of the required pages, defined a containing div with id="head-container" and in the body/window onload event, included

    await fetch("./appHeader.html")
    .then(response => response.text())
    .then((html) => {
        document.getElementById("head-container").insertAdjacentHTML("afterbegin", html);
    });