How to create buttons with javascript with the help of pyhton

Create this template

<html>

<head>
<style>


/* CSS */

div {

  font-size: 24px;
  color:  darkblue;
}

.button-55 {
  color:  darkblue;
  font-family: "Open Sans", sans-serif;
  font-size: 24px;
  letter-spacing: 2px;
  text-decoration: none;
  text-transform: uppercase;
  color: #000;
  cursor: pointer;
  border: 3px solid;
  padding: 0.25em 0.5em;
  box-shadow: 1px 1px 0px 0px, 2px 2px 0px 0px, 3px 3px 0px 0px, 4px 4px 0px 0px, 5px 5px 0px 0px;
  position: relative;
  user-select: none;
  -webkit-user-select: none;
  touch-action: manipulation;
}

.button-55:active {
  box-shadow: 0px 0px 0px 0px;
  top: 5px;
  left: 5px;
}

.button-55:hover {
/*  box-shadow: 0px 0px 0px 0px;
  top: 5px;
  left: 5px;*/
  background: yellow;
}
@media (min-width: 768px) {
  .button-55 {
    padding: 0.25em 0.75em;
  }
}
</style>


</head>

<body>
<!-- HTML !-->
<!-- debug -->

[button]

<script>

function button_clicked(div_id, phrase){
	// b1 = document.getElementById("b1")
	// b1.innerHTML = "Selling";
	inspect = document.getElementById(div_id);
	// inspect.innerHTML = b1.innerHTML;
	inspect.innerHTML = phrase;

  console.log(inspect, inspect.id, phrase)
  return inspect, phrase
}

</script>
</body>

</html>

The use this script to make a new page with multiple questions

import os


counter = 0
b1 = ""

def create_button(question, answer):
	global counter, b1
	
	button = f"""
	<button id="b{counter}" class="button-55" onclick="button_clicked('inspect{counter}', '{answer}')">
	{question}
	</button><br><br>
	<div id="inspect{counter}">...</div>
	<br>
	"""
	counter += 1
	b1 += button
	return button

def start():
	with open("template_54.html") as file:
		html = file.read()

	html = html.replace("[button]", b1)

	with open("example.html", "w") as file:
		file.write(html)

	os.startfile("example.html")

# =========== QUESTIONS ===================
create_button("How ho you feel", "good")
create_button("What's the time", "11 o clock")
create_button("Where is Rome", "In Italy")

# ====================================== END
start()

This is the result

An example using a dictionary to store the questions and answers

import os


counter = 0
b1 = ""

def create_button(question, answer):
	global counter, b1
	
	button = f"""
	<button id="b{counter}" class="button-55" onclick="button_clicked('inspect{counter}', `{answer}`)">
	{question}
	</button><br><br>
	<div id="inspect{counter}">...</div>
	<br>
	"""
	counter += 1
	b1 += button
	return button

def start():
	with open("template_54.html") as file:
		html = file.read()

	html = html.replace("[button]", b1)

	with open("example.html", "w") as file:
		file.write(html)

	os.startfile("example.html")


testo = {
"Chi è il turista?" : 
"""L'Organizzazione Mondiale del Turismo (OMT) definisce il turista un visitatore,
cioè una persona che intraprende un viaggio per una motivazione diversa da
quella di ottenere redditi nei luoghi visitati, che effettua viaggi irregolari di durata non superiore a un anno che prevedono almeno un pernottamento.""",

"Definisci il turismo":
"""Il turismo comprende I'insieme di relazioni che si instaurano tra i turisti,
le località visitate (ambiente e residenti) e gli operatori economici del settore.""",

"Come si è evoluto il turismo":
	"""Fino al 1700, turismo delle origini, viaggiavano solo le élite o i religiosi. Nel medioevo nascono le prime locande e taverne e nel 1700 i giovani aristocratici terminavano la loro formazione con un viaggio nelle principali capitali europee, il Gran Tour.
				Dal 1700 al 1960 inizia a viaggiare anche la classe media, grazie al miglioramento nei trasporti e al riconoscimento delle ferie retribuite. E’ il periodo del turismo moderno.
				Dagli anni ‘60 agli anni ‘90, grazie al boom economico, iniziano a viaggiare tutte le classi sociali. Nasce il turismo di massa.
				Dagli anni ‘90 ad oggi, inizia il turismo globale. Il turista non istituzionalizzato cerca nuove destinazioni diverse da quelle del turismo di massa, vuole vivere in modo più immersivo le realtà che visita, fare esperienze a contatto con le popolazioni e la cultura locale, utilizza internet per informarsi e organizzare il viaggio.""",

"Quali sono i fattori sociali che influenzano i flussi turistici?":
	"La motivazione del turista, i fattori politici (guerre), sociali (criminalità) e sanitari (epidemie).",

"Quali i fattori economici e come influenzano i flussi?":
	"""Reddito (proporzione diretta), prezzi dei servizi (indiretta), rapporto di cambio (l’euro è quotato certo per incerto, l’euro è fisso, varia la valuta straniera. Per convertire da euro a moneta straniera si moltiplica per il tasso, per convertire la valuta straniera in euro si divide per il cambio.""",

"Quali sono le tendenze del turismo?":
	"""Per 30 anni i flussi turistici sono sempre aumentati, tranne nel 2009, per la crisi economica iniziata l’anno precedente e nell’anno 2020 per la pandemia. Il ritmo di crescita è del 4,5%. L’Europa raccoglie il 50% degli arrivi, ma l’Asia cresce più velocemente e il gap si ridurrà. L’Italia ha 100 milioni di arrivi all’anno, è al quinto posto nel mondo, superata di recente dalla Cina. Deve migliorare il rapporto qualità prezzo per vincere la sfida con le mete asiatiche e, il sud, in particolare, deve migliorare le proprie infrastrutture. Il PIL è dovuto per il 10% al turismo. In Italia gli occupati nel settore sono 2.000.000.""",

"Quali sono gli indicatori della domanda turistica?":
	"Gli arrivi (i turisti), le presenze (i pernottamenti), la permanenza media (presenze/arrivi), il tasso di propensione turistica (viaggi/abitantix100).",

	"Quali sono gli indicatori dell’offerta?":
	"Il tasso di ricettività (posti letto/abitanti) e la densità ricettiva (posti letto/kmq).",

"Quali sono gli indicatori economici dello stato di salute del settore turistico in Italia?":
	"Il PIL, la spesa pro-capite, gli occupati e il saldo della bilancia turistica.",

"Come si misura il saldo della bilancia turistica?":
	"""Crediti per le spese degli stranieri in Italia - Debiti per spese degli italiani all’estero. Il saldo è positivo, perché spendono di più gli stranieri.""",

"Quali sono i principali organismi internazionali del turismo?":
"	OMT e WTTC.",

"Cos’è l’OMT?":
"""	è l’organizzazione mondiale del turismo, nata nel 1975, dal 2003 è diventata un’agenzia delle Nazioni Unite (UNWTO) ed ha sede a Madrid. Ha lo scopo di far sviluppare il turismo, con particolare attenzione al turismo responsabile, spingendo i flussi verso i PVS e di fornire statistiche sulle tendenze del settore turistico.""",

"Cos’è il WTTC?":
"""	Il World Travel & Tourism council è un forum delle prime 100 imprese turistiche che ha come scopo quello di facilitare la libertà di viaggio, snellendo le pratiche per il rilascio dei visti d’ingresso , far crescere il settore attraverso nuovi investimenti e riduzione della tassazione del settore e far crescere il turismo responsabile e sostenibile.
""",

"Quali sono le tappe principali dell’Unione europea?":
"""	Nel 1957 nasce la CEE con il trattato di Roma con lo scopo di creare un mercato comune, abolire i dazi e creare una politica comune nel settore agricolo e dei trasporti.
	Nel 1993 con il trattato di Maastricht nasce l’UEM, l’unione economica e monetaria, con dei parametri da rispettare per entrare nell’Unione e utilizzare l’euro, entrato in circolo dal 2002.""",

"Quali sono gli organi dell’UE?":
"""il consiglio europeo (formato dai capi di governo, detta la linea politica generale)
la commissione europea (organo esecutivo nominato dai capi di governo che presenta proposte di legge al Parlamento)
il consiglio dell’UE: formata dai ministri dei singoli paesi che si riuniscono quando devono trattare argomenti che riguardano il loro ministero.
Il Parlamento europeo (750 membri e un presidente) eletti ogni 5 anni da circa 500 milioni di elettori; approva le proposte della commissione insieme al cosiglio dell’UE.""",

"Come ha riordinato le competenze tra UE e singoli stati il Trattato di Lisbona?":
"""	Vi sono delle materie di competenza UE (unione doganale, politica monetaria, concorrenza), altre in concorrenza tra UE e Stati (ambiente, trasporti, energia), e altre materie che l’UE si limita a coordinare e sostenere come per il turismo.""",

"Qual è la differenza tra regolamenti e direttive UE?":
"""	I regolamenti si applicano immediatamente, mentre le direttive devono prima essere recepite dai singoli Parlamenti dei vari Stati.""",


"Quali sono gli organi di governo del turismo?":
"""	La Direzione generale del turismo che è una delle direzioni del MIT, il ministero del turismo (prima, insieme al Ministero della cultura faceva parte del MIBACT, ministero dei beni e delle attività culturali e del turismo), si occupa delle programmazioni delle politiche turistiche nazionali e delle politiche di sviluppo del sistema turistico.
	Le regioni che hanno competenze esclusive in materia di politiche di programmazione e accoglienza turistica, di regolamento delle professioni turistiche, di autorizzazione e di controllo delle attività turistiche.
	La conferenza Stato-Regioni si occupa di coordinare le politiche di Governo e Regioni.""",

"Quali sono i principali enti di promozione del turismo?":
"""	L’ENIT (Agenzia nazionale del turismo), ente pubblico, il CAI, il TCI, le APT, IAT e Pro loco a livello locale, gli STL (collaborazioni tra pubblico e privato)""",

"Quali sono i principali enti di statistica?":
	"""L’ISTAT, istituto nazionale di statistica, che fornisce dati su tanti aspetti della società (inflazione ad esempio e arrivi, presenze), la Banca D’Italia (dati per il saldo della Bilancia turistica), l’ONT (elabora i dati di Istat, Banca d’Italia e OMR) e l’ISNART (promuove il turismo e fa parte delle Camere di commercio.""",

"Quali sono le associazioni di categoria del settore turistico?":
	"Federturismo e Confturismo.",

"Chi rappresentano, i lavoratori o le imprese del settore turistico?":
	"Le imprese.",
	
"Federturismo fa parte di Confindustria?":
	"Sì.",

"A quali contrattazioni prende parte insieme ai sindacati dei lavoratori?":
	"""Alle quelle per la firma del Contratto collettivo nazionale dei lavoratori del settore turistico che stabilisce le regole che disciplinano il contratto di lavoro."""

}


# =========== QUESTIONS ===================
for k in testo:
	create_button(k, testo[k])

# ====================================== END
start()