Show image when array == array

I have a problem with my jquery, i need to ask a question in my input if that input is equal to the array then it has to show the text2 with the awnser array but i have no error but it doesnt work.

<section>
        <img id="samen" src="img/samen.svg" alt="samen">
        <img id="klein" src="img/klein.svg" alt="klein">
        <div id="text1">
        <p>Vb.: Professor waarvoor staat html?</p>
        <p>antwoord: HyperText Markup Language</p>
        <input type="text" name="vraag" id="vraag" onkeypress="keyCode(event)" placeholder="Professor, mag ik iets vragen?" required/><br>
        <input id="button" type="submit" name="button" value="wat kan ik stellen?" />
        </div>
        <img id="groot" src="img/groot.svg" alt="groot">
        <div id="text2">
            <p id="arraytext"></p>
        </div>
    </section>  
</main>
<footer>
    <img id="logo" src="img/logo.png" alt="logo">
</footer>
<script>
    var vragen = ["is het gif of jif?"];
    var antwoorden = ["Het is Gif tenzij je de historie kent."];
    var input = $("#vraag").val();
    document.getElementById('button').onclick = function() {
        alert("- Is het gif of jif?"+"\n"+"- ");
    }

    function keyCode(event) {
        var x = event.which || event.keyCode;
            if (x == 13) {
                if(input == vragen){
                    event.preventDefault();
                   $('#text2').css('display', 'inline-block');
                }
                else{
                    event.preventDefault();
                }
            }
    }
</script>