Search code examples
javascriptinnerhtmlscoring

Changing value using innerHTML in Javascript

It's been a while since I've worked with Javascript and HTML coding. I am trying to construct a basic scoreboard system that will add points to the home and away scores as the points are earned. I am currently working on the Home right now and will basically replicate the Away when I've knocked out the basic.

Here's my code:

<script type="text/javascript">

function addTD(){

    document.getElementById("score").innerHTML +=6;

}

function addPAT(){document.getElementById("score").innerHTML ++;}

</script>

<div id="score"></div>

<a href="javascript:addTD();">Touchdown</a>
<a href="javascript:addPAT();">PAT</a>

When I select the Touchdown link, it adds a 6 and when I select the PAT link, it changes the 6 to a 7. But when I go to select Touchdown again, it adds the 6 after the 7.

76
Touchdown PAT

How can I make the 7 change to a 13 when I select Touchdown again?

Thanks in advance for your help. Brandon

Solution

  • change to 

    function addTD(){            
   document.getElementById("score").innerHTML=
        parseInt(document.getElementById("score").innerHTML,10)+6;
}