Can't recreate simple jQuery impromptu dialogue

Question

I'm copying this nearly verbatim from Trent Richardson's impromptu example 10 but I can't get it to work. For some reason, examples 8 and 9 just won't work for me. I'm guessing it's something obvious, but I can't figure it out.

head:

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js" type="text/javascript"></script>
<script src="jquery-impromptu.4.0.min.js" type="text/javascript"></script>
<!--<script src="common.js" type="text/javascript"></script>-->
<link rel="stylesheet" media="screen and (min-device-width: 1050px)" type="text/css"     href="example.css">

<script type="text/javascript">
  var txt = 'Try submitting an empty field:<br /> 
  input type="text" id="alertName" 
  name = "myname" value="" />';

  function mysubmitfunc(e,v,m,f){
    an = m.children('#alertName');
    if(f.alertName == ""){
        an.css("border","solid #ff0000 1px");
        return false;
    }
    return true;
  }
</script>

body:

<button onclick="$.prompt(txt,{ submit: mysubmitfunc, buttons: { Ok:true } })" title="Example 10">Example 10</button>

Answer 1

HTML:

<button id="example10">Example 10</button>

JavaScript:

var text = 'Try submitting an empty field:<br><input type="text" id="alertName" name="myname" value="">';

$( '#example10' ).on( 'click', function () {      
    $.prompt( text, { submit: function ( e, val, $elem ) {
        var input = $elem.children( '#alertName' )[0];
        if ( input.value === '' ) {
            $( input ).css({ border: '1px solid red' });
            return false;
        }
        return true;
    }, buttons: { Ok: true } });    
});

Live demo: http://jsfiddle.net/NcDEh/2/