Number guessing game in JS

I want to create a number game where the user enters a number from 1-100, and it the script will attempt to guess in 10 guesses the user's input. If within 10 guesses it guesses the right number it wins, otherwise the user wins. I wanted it to display the computer's guess in one line, and the next line show whether it was greater or less than the user's input. This would continue until either in 10 guesses it fails or before 10 guesses it does it.

var randomNum = Math.floor(Math.random() * 100) + 1;
var guesses = 10;

function guessNum() {
  var input = parseInt(document.getElementById("
numberGuess ").value);
  do {
    //guesses--;
    document.getElementById("
guess ").innerHTML += " < p > I 'll guess " + randomNum + " </p>";

    if (input < randomNum) {
      document.getElementById("result").innerHTML += "<p>Your input is less than the number I'
m thinking about. < /p>";
      guesses = guesses - 1;
    } else if (input > randomNum) {
      document.getElementById("result").innerHTML += "<p>Your input is greater than the number I'm thinking about.</p > ";
      guesses = guesses - 1;
    }
  }
  while (guesses > 0);
  if (input != randomNum) {
    document.getElementById("
result ").innerHTML += " < p > I can 't figure it out. I guess you win!</p>";
  }
  if (input == randomNum) {
    document.getElementById("result").innerHTML += "<p>Our numbers match. I win!! :)</p>";
    guesses = 0;
  }
}

<h1>Number Game</h1>
<div id="mainCont">
  <p>Number:
    <input type="text" id="numberGuess">
    <input type="button" onclick="guessNum();" value="Guess">
  </p>
  <div id="guess"></div>
  <div id="result"></div>
</div>