Updating inner text live using jQuery

I have a project on which I am working now. In this project I want to live update some buttons text. I used contenteditable="true" in my project. I have 2 solutions. The first one works ok, but I don't get what I wanted in the second one has a problem. In 2nd one I want when user press a key for long time, the text will show without releasing the key.
In the first one I used keyup event and in the second one I used the keydown event. I want when the keyup event happens the buttons' inner text will change to the new text.

Here is my first ones code (keyup):

$('[contenteditable]').on('keyup', function() {
    $(this).closest('.code').prev().find('a').html($(this).html());
})

jsfiddle.

Here is my second ones code (keydown):

$('[contenteditable]').on('keydown', function() {
    $(this).closest('.code').prev().find('a').html($(this).html());
})

jsfiddle.

Try the input event

$('[contenteditable]').on('input', function() {
  $(this).closest('.code').prev().find('a').html($(this).html());
})