JSFiddle - React, Tailwind, and code Playground

HTML

<h1>Let's Guesse Number</h1>
<form>
  <p>Write the number between 1 and 100</p>
  <input id="number" name="number" type="text">
  <input type="submit">
</form>
<div></div>
<h2></h2>

JavaScript

var resultat = Math.floor(Math.random() * 100) + 1;
var compteur = 1;
$('div').html("( answer is : " + resultat + " )");

$('form').on('submit', function(e) {
  e.preventDefault();
  if (compteur < 8) {
    var inputVal = $('#number').val();
    var nbInput = Number(inputVal);

    compteur++;
    if (nbInput !== resultat) {
      if (nbInput < resultat) {
        $('h2').html(inputVal + ' is too small');
      } else {
        $('h2').html(inputVal + ' is too big');
      };
    } else {
      $('h2').html('Yes! ' + inputVal + ' is the right number');
    };
  } else
    $('h2').html('You reached the limit of 7 guesses.');
});