JSFiddle - React, Tailwind, and code Playground

HTML

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>
    <script type="text/javascript" src="funtranslator.js"></script>
  </head>
  <body>
      <form id="toBeTranslatedForm" action="" method="POST" >
             <textarea name="userInput" id="toBeTranslatedTextArea"></textarea>
             <select id="translationOptions" name="translationOptions"></select>
      </form>
   </body>
</html>

JavaScript

function populateTranslationOptions() {
    var translationOptions = ["Egyptian Hieroglyphs", "Al Bhed (Final Fantasy X)", "Futurama"];
    
    $.each(translationOptions, function(index, value) {
        $('#translationOptions')
            .append($("<option></option>")
                    .attr("value", value)
                    .text(value));
    });
}

    $(document).ready(function() {
        populateTranslationOptions();
    });