Trying to increment a random number with addition assignment operator (JavaScript)

Question

So I've been trying to increment a random number by clicking on a button. It works fine with a decrement button, but for some reason I'm having a problem with the increment button.

I looked at the developer Mozilla website and several other source and Mozilla mentions.
// bar = 5
bar += 2 // 7

As far as I know, the value of my random number is recognised as some sort of number. (it works with decrement) I have a feeling it recognises the number as a string as it adds anything after the current value.

<!DOCTYPE html>
<html lang="en" dir="ltr">
  <head>
    <meta charset="utf-8">
    <title></title>
  </head>
  <body>


    <button type="button" id="button" name="button">Random Number</button>

    <input type="text" name="" id="number" value="">
    <button type="button" id="inc" name="button">Increment</button>
    <button type="button" id="dec" name="button">Decrement</button>
    <script>

      document.getElementById('button').onclick = function myFunction() {
        document.getElementById('number').value = Math.floor((Math.random() * 10) + 1);
      }
      document.getElementById('inc').onclick = function myDunction() {
        document.getElementById('number').value += 1;
      }
      document.getElementById('dec').onclick = function myMeh() {
        document.getElementById('number').value -= 1;
      }

    </script>
  </body>
</html>

Expected:
Random number: 5 Increment: 6 and Decrement: 4, and the values should change every time when I click on the button.
Actual result:
Random number: 5 Increment: 51 and Decrement: 4

Trying to increment a random number with addition assignment operator (JavaScript)

0 Answers0