Kalkulator w Javascript - problem z zapisywaniem wcześniejszych wartości i obliczaniem

Problem wydaje się banalny ale nie potrafię go rozwiązać dla przypadku innego niż dodawanie. Otóż chcę by mój kalkulator po wpisywaniu danych wartości np. 5 i 5, oraz dodaniu ich, wypisywał w wyniku 10, a po kolejnym naciśnięciu buttona plusa 10, 15, 20, 25 i tak dalej. na początku w ogóle nie chciało to działać, bo wartości te JS interpretował jako łańcuch znaków i przy dodawaniu 5+5 wynik zapisywało jako 55. Z tym problemem się już uporałem. Niestety działa poprawnie tylko dla dodawania. Oto mój kod (z pominięciem css'a):

document.getElementById('result').value = 0;

function add() {
  var a = parseInt(document.getElementById('l1').value);
  var b = parseInt(document.getElementById('l2').value);
  var c = parseInt(a + b);
  document.getElementById('result').value = parseInt(document.getElementById('result').value) + c;
}

function sub() {
  var a = parseInt(document.getElementById('l1').value);
  var b = parseInt(document.getElementById('l2').value);
  var c = parseInt(a - b);
  document.getElementById('result').value = parseInt(document.getElementById('result').value) + c;
}

function mult() {
  var a = parseInt(document.getElementById('l1').value);
  var b = parseInt(document.getElementById('l2').value);
  var c = parseInt(a * b);
  document.getElementById('result').value = parseInt(document.getElementById('result').value) + c;
}

function div() {
  var a = parseInt(document.getElementById('l1').value);
  var b = parseInt(document.getElementById('l2').value);
  var c = parseInt(a / b);
  document.getElementById('result').value = parseInt(document.getElementById('result').value) + c;
}

function divmod() {
  var a = parseInt(document.getElementById('l1').value);
  var b = parseInt(document.getElementById('l2').value);
  var c = parseInt(a % b);
  document.getElementById('result').value = parseInt(document.getElementById('result').value) + c;
}

<form name="calculator">
  <input type="text" id="l1" />
  <input type="text" id="l2" />
  <br/>
  <input type="button" value="+" onclick="add()" />
  <br/>
  <input type="button" value="-" onclick="sub()" />
  <br/>
  <input type="button" onclick="mult()" />
  <br/>
  <input type="button" value="%" onclick="divmod()" />
  <input type="button" value="/" onclick="div()" />
  <br/>
  <input type="button" value="clean" class="class2" />
  <br/>
  <p style="color:white; font-size:30px;">Result:</p>
  <input type="text" id="result" />
  <br/>
</form>

Z problemem zablokowania wartości przy dodawaniu (brak ciągłego dodawania kolejnej liczby przy naciśnięciu przycisku jak opisywałem poprzednio) uporałem się dopisując zamiast document.getElementById('result').value = c linijkę document.getElementById('result').value = parseInt(document.getElementById('result').value) + c; - tutaj pomógł stackoverflow. Samo przypisanie c do document.getElementById.value powoduje po prostu zmianę wartości wyniku na zmienną c, natomiast += to konkatenacja ponieważ document.thing.value zawsze zwróci łańcuch, a łańcuch + liczba przypiszę liczbę do łańcucha (jako łańcuch). Więc zrobiłem to tak:

document.getElementById('result').value = parseInt(document.getElementById('result').value) + c;

Czyli: stara wartość stringa = parseInt(stara wartość stringa) + nowa wartość. Gdzie nowa wartość to po prostu c.

Działa dobrze, ale tylko dla dodawania. Dla pozostałych obliczeń wyniki są całkowicie złe, bo program próbuje dalej dodawać te liczby, a nie potrafię zrobić tego inaczej. Czy ktoś ma jakiś pomysł i mógłby pomoc?