Untitled

<!DOCTYPE html>
<html>
<head>
<title>The Psychic Game</title>
<meta charset="utf-8">
<link rel="stylesheet" type="text/css" href="assets/css/reset.css">
<link rel="stylesheet" type="text/css" href="assets/css/style.css">
</head>
<body>

<div id="content">

<h1>The Psychic Game</h1>

<h2>Guess what letter I'm thinking of:</h2>

<div id="score">

<p>Wins: </p>
<p>Losses: </p>
<p>Guesses Left: </p>
<p>Your Guesses so far: </p>

</div>


<script type="text/javascript" src="assets/javascript/game.js"></script>

</div>

</body>
</html>

var computerChoices = ["a", "b", "c", "d", "e", "f", "g", "h", "i", "j",
"k", "l", "m", "n", "o", "p", "q", "r", "s", "t", "u", "v", "w", "x", "y",
"z"];
var wins = 0;
var losses = 0;
var guessesLeft = 9;
var guessesSoFar = [];


document.onkeyup = function(event) {

var userGuess = String.fromCharCode(event.keyCode).toLowerCase();

guessesSoFar.push(userGuess);

var computerGuess = computerChoices[Math.floor(Math.random() *
computerChoices.length)];


if (userGuess === computerGuess) {

    wins++;
    guessesLeft = 9;
    guessesSoFar.length = 0;

}

else if (guessesLeft === 0) {

    losses++;
    guessesLeft = 9;
    guessesSoFar.length = 0;
}

else if (userGuess !== computerGuess) {

    guessesLeft--;
}


var html =
    "<p>Wins: " + wins + "</p>" +
    "<p>Losses: " + losses + "</p>" +
    "<p>Guesses Left: " + guessesLeft + "</p>" +
    "<p>Your Guesses so far: " + guessesSoFar + "</p>";

document.getElementById('score').innterHTML = html;

}