jquery - Keydown Not Triggered Only on Button w/ "contenteditable" Tag -

i using contenteditable="true" tag make content in tags editable. can edit content in element tag, problem arises when try detect keydown event jquery.

jsfiddle demo

note "hello world", in paragraph element, editable. button text "i'm button" editable, inside button element.

when type in paragraph element, keypresses incremented each key pressed. however, when type in button element, keypresses not incremented. problem. apparently, keydown event not being detected inside button element, though being detected inside paragraph element.

to demonstrate not problem way js written, clicking either paragraph or button element increment clicks counter.

so question is, why isn't keydown event being detected inside button element, , can detect it?

how work-around?

jsfiddle : http://jsfiddle.net/va74w/

putting button content in span contenteditable=true

html

<button>&nbsp;<span contenteditable='true'>i'm button</span>&nbsp;</button> 

  not allow user delete button.

need trim   , span tags button text after completing edit.