JSFiddle - React, Tailwind, and code Playground

HTML

<body>
    <ul style="list-style-type:none" id="buttons">
        <li>
            <input type="button" value="English" id="english" onclick="alert('Hello! How are you?');"/>
        </li>
        <li>
            <input type="button" value="Spanish" id="spanish" onclick="alert('Hola! Como estas?');"/>
        </li>
        <li>
            <input type="button" value="Hebrew" id="hebrew" onclick="alert('Shalom');" />
        </li>
        <li>
            <input type="button" value="French" id="frech"  onclick="alert('Bonjour');"/>
        </li>
    </ul>
    </body

JavaScript

function buttonClick () {
	if(!document.getElementsByTagName) return false;
	if(!document.getElementById) return false;
	if(!document.getElementById(id)) return false;
	if(!document.getAttribute("id")) return false;
	//store buttons in variable buttonsList
	var english = document.getElementById("english");
			
				case "english":
				alert("Hello! How are you?");
				break;
				case "spanish":
				alert("Hola! Como estas?");
				break;
				case "hebrew":
				alert("Shalom!");
				break;
				case "french":
				alert("Bonjour!");
				break;
				default:
				alert("Please select a language");
			}
			buttons.onclick = buttonClick(this);
		}
	}