[Dilettante_Pro]

<h2>Число: 0.</h2>
<button class="svg-button" value="10">Button1</button>
<button class="svg-button" value="20">Button2</button>
<button class="svg-button" value="30">Button3</button>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script>
$(function() {
   var sum = 0;
   $(".svg-button").on("click",function () {
          sum += +this.value;
          $('h2').text("Число:" +  sum  + ".");
         $(this).attr("disabled","disabled");
    });
});

</script>

Можно и .one

<h2>Число: 0.</h2>
<button class="svg-button" value="10">Button1</button>
<button class="svg-button" value="20">Button2</button>
<button class="svg-button" value="30">Button3</button>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script>
$(function() {
   var sum = 0;
   $(".svg-button").one("click",function () {
          sum += +this.value;
          $('h2').text("Число:" +  sum  + ".");
     });
});

</script>