title: One of several buttons isn't working in JS and HTML
body: <p>So I've been coding a little idle game, and I have a few buttons which are for upgrades. I had 3 before, and when i added the fourth one, for some reason it isn't working properly.</p>
  
  <p>JavaScript:</p>
  
  <pre><code>gainUpgrade: function() {
      if (engine.player.Energy &gt;= engine.idleGainUpgrade) {
          engine.player.Energy -= engine.idleGainUpgrade;
          engine.idleGain += 0.5;
          engine.display.Energy.innerHTML = engine.player.Energy;
          engine.display.idleGain.innerHTML = engine.idleGain;
          engine.Status("Upgrade unlocked!");
          engine.idleGainUpgrade += (engine.idleGainPriceMultiplier * 50 * 2);
          engine.display.idleGainUpgrade.innerHTML = engine.idleGainUpgrade;
          engine.idleGainPriceMultiplier +=0.5;
      } else {
          engine.Status("Not enough energy!");
      }
  },
  </code></pre>
  
  <p>That's the function that is linked the with the button, the JavaScript that should trigger it is:</p>
  
  <pre><code>engine.clickables.gainUpgrade = document.getElementById("idlegainupgrade");
  engine.clickables.gainUpgrade.addEventListener("click", function() {
      engine.gainUpgrade;
  });
  </code></pre>
  
  <p>And the HTML bit of code:</p>
  
  <pre><code>&lt;input type="button" id="idlegainupgrade" value="Increase gain from idle!"&gt;&lt;br /&gt;&lt;br /&gt;
  &lt;h6&gt;
      Idle Gain: &lt;span id="idlegain"&gt;&lt;/span&gt;
      &lt;br /&gt;Idle Gain Upgrade Cost: &lt;span id="idlegainupgradecost"&gt;&lt;/span&gt;
  &lt;/h6&gt;
  </code></pre>
  
  <p>What have I done wrong?</p>