Hangman Game , i had tried and cant do , after trying to debug and cant work

hangman

<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>testhtml</title>
</head>
<body>
	<script type="text/javascript">
		var Words =       
			[
				"cute","pretty","handsome","ugly","fat","short","sweet","sexy","beautiful","lovely","lovable",
			];
		var score, fails, createdKeyword, displayedKeyword;
		score = 0;
		
		function Hangman()
		
		{
		fails = 0;
		var num = Math.floor(Math.random() * keywords.length);
		selectedKeyword = keywords[num];
		selectedKeyword = selectedKeyword.toUpperCase();
		displayedKeyword = "";
		for( i = 0; i < selectedKeyword.length; i++)
			{
				if (selectedKeyword.charAt(i) == " " || selectedKeyword.charAt(i) == "-")
			
				{
					displayedKeyword += " ";
				}
				else
				{
					displayedKeyword += "_";
				}
			}
				document.getElementById("hangman").value = displayedKeyword;
				document.getElementById("msg").value = "A word had been select, click button below to play game.";
				document.getElementById("score").value = score;
				document.getElementById("fails").value = fails;
 	}
	
	function find(x)
	{
		var found = false;
		for( i = 0; i < selectedKeyword.length; i++)
			{
				if (selectedKeyword.charAt(i) == x)
					{
							displayedKeyword = displayedKeyword.substr(0,i) + x + displayedKeyword.substr(i+1)
							found = true;
					}
			}	
		if (found)
			{
				if (displayedKeyword == selectedKeyword)
					{
					alert("Well Done")
					score++;
					}
			}
		else
			{
				fails++;
				if (fails == 6)
			{
				alert("You lose")
				fails = 0;
					var num = Math.floor(Math.random() * keywords.length);
					selectedKeyword = keywords[num];
					selectedKeyword = selectedKeyword.toUpperCase();
					displayedKeyword = "";
					for( i = 0; i < selectedKeyword.length; i++)
			{
				if (selectedKeyword.charAt(i) == " " || selectedKeyword.charAt(i) == "-")
			
				{
					displayedKeyword += " ";
				}
				else
				{
					displayedKeyword += "_";
				}
			}
			}
					}
			document.getElementById("hangman").value = displayedKeyword;
			document.getElementById("score").value = score;
			document.getElementById("fails").value = fails;
	}
	
	function setCharAt(str,index,chr)
	{
		if (index > str.length-1) return str;
		return str.substr(0, index) + chr + str.substr(index+1);
	}
	
</script>
</head>
	
<body>
<table width="45%" border="1" bgcolor = "#808080" align="center">
  			<tr>
				<td colspan="4" align="right" width="28%" height="63">
				Score: <input type="text" value="" size="4" readonly>
				<br/>
				<br/>
				Fails(6): <input type="text" value="" size="4" readonly>
				</td>
				<td colspan="7" align="center" width="51%">
				<input type="text" id="hangman" size="30" value=" --- Hangman --- " disabled>
				<br/>
				<br/>
				<input type="text" id="getword" size="30" value=" Click Start to get a word. " disabled>
				</td>
				<td colspan="2" align="center" width="13%"><button id ="reset">Start</button></td>
			</tr>
		</table>
		<table width="45%" border="1" bgcolor = "#808080" align="center">
			<tr>
				<td align="center" width="7.69%">
					<input type="button" value="A" onClick="observe('A')" />
				</td>
				<td align="center" width="7.69%">
					<input type="button" value="B" onClick="observe('B')" />
				</td>
				<td align="center" width="7.69%">
					<input type="button" value="C" onClick="observe('C')" />
				</td>
				<td align="center" width="7.69%">
					<input type="button" value="D" onClick="observe('D')" />
				</td>
				<td align="center" width="7.69%">
					<input type="button" value="E" onClick="observe('E')" />
				</td>
				<td align="center" width="7.69%">
					<input type="button" value="F" onClick="observe('F')" />
				</td>
				<td align="center" width="7.69%">
					<input type="button" value="G" onClick="observe('G')" />
				</td>
				<td align="center" width="7.69%">
					<input type="button" value="H" onClick="observe('H')" />
				</td>
				<td align="center" width="7.69%">
					<input type="button" value="I" onClick="observe('I')" />
				</td>
				<td align="center" width="7.69%">
					<input type="button" value="J" onClick="observe('J')" />
				</td>
				<td align="center" width="7.69%">
					<input type="button" value="K" onClick="observe('K')" />
				</td>
				<td align="center" width="7.69%">
					<input type="button" value="L" onClick="observe('L')" />
				</td>
				<td align="center" width="7.69%">
					<input type="button" value="M" onClick="observe('M')" />
				</td>
			</tr>
			<tr>
				<td align="center" width="7.69%">
					<input type="button" value="N" onClick="observe('N')" />
				</td>
				<td align="center" width="7.69%">
					<input type="button" value="O" onClick="observe('O')" />
				</td>
				<td align="center" width="7.69%">
					<input type="button" value="P" onClick="observe('P')" />
				</td>
				<td align="center" width="7.69%">
					<input type="button" value="Q" onClick="observe('Q')" />
				</td>
				<td align="center" width="7.69%">
					<input type="button" value="R" onClick="observe('R')" />
				</td>
				<td align="center" width="7.69%">
					<input type="button" value="S" onClick="observe('S')" />
				</td>
				<td align="center" width="7.69%">
					<input type="button" value="T" onClick="observe('T')" />
				</td>
				<td align="center" width="7.69%">
					<input type="button" value="U" onClick="observe('U')" />
				</td>
				<td align="center" width="7.69%">
					<input type="button" value="V" onClick="observe('V')" />
				</td>
				<td align="center" width="7.69%">
					<input type="button" value="W" onClick="observe('W')" />
				</td>
				<td align="center" width="7.69%">
					<input type="button" value="X" onClick="observe('X')" />
				</td>
				<td align="center" width="7.69%">
					<input type="button" value="Y" onClick="observe('Y')" />
				</td>
				<td align="center" width="7.69%">
					<input type="button" value="Z" onClick="observe('Z')" />
				</td>
			</tr>
		</table>
</body>
</html>