How do I deal with a static header/footer that doesn't change within my 10+ pages. Keep in mind all these pages share the same header/footer. So currently If I change one content from the header/footer I would need to go to all other pages in order to make the same changes.

What I'm hoping to achieve is basically to change once and have the change reflected on all pages.

I was thinking of adding the header/footer (HTML) in a .txt file and calling that .txt file JavaScript way. But I'm pretty sure its bad practice and a security risk to have html in a .txt file and too call that .txt file through js.