JSFiddle - React, Tailwind, and code Playground

HTML

<body>
    <ul style="list-style-type:none" id="buttons">
        <li>
            <input type="button" value="English" id="english" />
        </li>
        <li>
            <input type="button" value="Spanish" id="spanish" />
        </li>
        <li>
            <input type="button" value="Hebrew" id="hebrew" />
        </li>
        <li>
            <input type="button" value="French" id="frech" />
        </li>
    </ul>
    </body

JavaScript

$(document).ready(function() {
     $('input:button').click(function() {
        var buttons = $(this).val();
         alert("You have clicked on button "+buttons);
         switch(buttons){
             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");
                        
         }
      });

  });