checkVowel.html

<!DOCTYPE html>
<html>
    <head>
        <script type="text/javascript" language="javascript">
            function checkVowels()
                {
                    var pElement=document.getElementById('printElement');
                    pElement.innerHTML="";
                    var inp=document.getElementById('inputText').value;
                    inp=inp.toLowerCase();
                    var inpLength=inp.length;
                    var vowels=new Array('a','e','i','o','u');
                    var stor=new Array();
                    var count=0;
                    for(var i=0;i<inpLength;i++)
                        {
                            for(var j=0;j<vowels.length;j++)
                                {
                                    if(inp.charAt(i)==vowels[j])
                                        {
                                            stor[count]=vowels[j];
                                            count++;
                                        }
                                }
                        }
                    for(var i=0;i<stor.length;i++)
                        pElement.innerHTML+=stor[i] + " | ";
                    pElement.innerHTML+="<br> Total no. vowels are : " + count;
                    pElement.style.visibility="visible";
                }
        </script>
        <style>
            body{
                font-family:Cambria,"sans-serif";
            }
            div{
                padding:10px;
                margin:10px 0px;
                color:#FFF;
                background-color:#000;
                font-family:Cambria,"sans-serif";
                font-size:2em;
                line-height:150%;
            }
            input[type="text"]{
                font-family:inherit;
                font-size:1em;
                padding:5px;
            }
            button{
                font-family:inherit;
                font-size:1em;
                padding:5px;
                width:80px;
            }
        </style>
    </head>
    <body>
        <input type="text" id="inputText">
        <button type="button" onclick="checkVowels()">Check</button>
        <br>
        <div id="printElement" style="visibility:hidden;"></div>
    </body>
</html>