Botão de mais e de menos não funciona se alterado o input

Opa galera.

Tenho um input que é preenchido com uma nota (0,0) e que vai até 10. Ao lado desse input tem dois botões, um para aumentar a nota em 0.1 e o outro para diminuir a nota em 0.1. O problema é que quando eu altero o valor da nota manualmente, esses botões deixam de funcionar. Como arrumo?

HTML:

<div class="nota left">
 <label>NOTA:</label>
 <input type="text" value="0,0" maxlength="3" class="maskNota" />
 <!-- Controladores -->
 <a href="#" class="nota-mais" title="Aumentar nota"><img src="img/voto_mais.png" alt="" /></a>
 <a href="#" class="nota-menos" title="Diminuir nota"><img src="img/voto_menos.png" alt="" /></a>
</div>

jQuery:

// Botões de mais/menos nota

var notaMais = $('.nota-mais'),
notaMenos = $('.nota-menos');

// Nota mais

notaMais.click(function(n){
n.preventDefault();

var pai = $(this).parents()[0],

inputNota = $('.maskNota', pai),
notaVal = inputNota.val().replace(',','.'),
notaVal = parseFloat(notaVal) + parseFloat(0.1),

notaVal = notaVal.toFixed(1);

if (notaVal >= 10) {
inputNota.attr('value', '10');
}

else {

inputNota.attr('value', notaVal.replace('.',','));
}
});

// Nota menos

notaMenos.click(function(b){
b.preventDefault();

var pai = $(this).parents()[0],

inputNota = $('.maskNota', pai),
notaVal = inputNota.val().replace(',','.'),
notaVal = parseFloat(notaVal) - parseFloat(0.1),

notaVal = notaVal.toFixed(1);

if (notaVal <= 0) {
inputNota.attr('value', '0,0');
}

else {

inputNota.attr('value', notaVal.replace('.',','));
}
});

Exemplo Online