JSFiddle - React, Tailwind, and code Playground

by joycse06

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(i,value) {   
        $('#translationOptions')
            .append($("<option></option>")
            .attr("value",value)
            .text(value)); 
    });
}

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