jQuery keydown event

jQuery keydown event

<script
src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
sqHTML = "<div id=\""+sqStringTemp+"\"
class=\"puzzlesquare\"><input type=\"text\"
class=\"puzzlesquareinput\" maxlength=\"1\"
style=\"text-transform: uppercase;\"
onkeypress=\"foo(event)\"/></div>";
jQuery("#gridpuzzleouter").append(sqHTML);
function foo(event) {
//console.log(event.charCode);
console.log( String.fromCharCode(event.charCode) );
}
//keydown event
jQuery(".puzzlesquareinput").on('keydown', function() {
alert("keydown...");
});
I have a strange problem with the event not firing. The JavaScript
function works fine and prints the key to the console. I am wondering why
the jQuery for the keydown event is not firing. There are no errors in my
console showing up. The jQuery works with jsFiddle but not on my
development machine.
Thanks in advance...