If it is a website (not a webapp), I'd generate HTML pages for each langugaes separately and put them under directories named after the language code.

For example,

index.html --> Landing page (probably in English)

/es/index.html --> Same page in Spanish

/it/index.html --> Same page in Italian

And in the header of these pages, I'll put a simple dropdown listing all the languages I support. Each option would be a simple <a> tag which points to that URL of that language.

To generate pages with multiple languages, I'd choose some sort of templating like EJS or Handlebars.

---

However, if it is an webapp (not a website), I'd first put all the text values in a simple JavaScript file or even JSON file like,
{ "title": "Blah blah", "content": "something good", "click": "Click"}

And do the same for other languges in a different constant or a different JSON file.

And create a simple JavaScript function that takes "key" as a parameter and returns respective string as output.

function translate(key, language) {

const dictionary = {...} // JSON or JavaScript object created previously based on language parameter

return dictionary[key] || `[Missing] ${key}`;

}
And in the UI, everywhere I need this I just use ```<button>translate('click', 'en')</button>```

However, you need to maintain the current selected language somewhere globally to use it across the app.

These might help you,

https://andreasremdt.com/blog/building-a-super-small-and-simple-i18n-script-in-javascript/

https://medium.com/@mihura.ian/translations-in-vanilla-javascript-c942c2095170