crypt game

<!DOCTYPE html>
<html>
<head>
    <title>cryptMe</title>
</head>
<body>
    <center>
        <h1>Crypt Game</h1><hr>

    <input type="text" placeholder="enter your text here" id="originalText"><br><br><!--make a text box whare the user enters text-->
    <input type="button" value="Crypt Me!" onclick="cryptit()"/><!--make a button that when clicked crypts the text with the function-->
    <div id="res"></div><!--a div to show the text after crypt-->

    </center>

    <script>
        /*a fnction that take the text from the box, set a new array of string, and make a loop*/
        function cryptit() {

            var myOriginal = originalText.value;
            var myCrypt = "";
            for(var counter = 0; counter < myOriginal.length; counter+=1) /*this loop check if the counter is less than the the value, than adds another text to counter*/
            {

                if(myOriginal[counter]=="a")
                {
             myCrypt+="u"
            }
            else if (myOriginal[counter]=="e")
                        {
                            myCrypt+="o"
                        }

            else if (myOriginal[counter]=="i")
                        {
                            myCrypt+="i"
                        }
            else if (myOriginal[counter]=="o")
                        {
                            myCrypt+="e"
                        }

             else if (myOriginal[counter]=="u")
                        {
                            myCrypt+="a"
                        }
                        else {

                      myCrypt+=myOriginal[counter];

                        }
                    }

                    res.innerHTML=myCrypt;/*show text in the div from the res in HTML*/

                }
    </script>

</body>
</html>