动态创建的输入不响应Jquery事件

Question

当选择了多个选择列表选项时，我已动态创建输入文本字段。问题是那些输入字段不响应Jquery的事件。

以下是我使用的代码：

<form>
  Select from the multiple select menu to generate input fields<br>
    <select id="sel" multiple="multiple">
        <option value="1">Tomato</option>
        <option value="2">Banana</option>
        <option value="3">Apple</option>
        <option value="4">Orange</option>
    </select>
    <div id="panel">
    </div>
</form>
<script type="text/javascript">
if (!window.jQuery) alert('Jquery is missing');
$(document).ready(function() {
    var e = new Array();
    $("#sel").change(function(event) {
        str = '';       
        $( "#sel option:selected" ).each(function() {
            //str += $( this ).val() + " ";
            //"+$( this ).val()+"           
            i = $(this).index();
            str += "<input title='"+i+"' type='text' value='"+((e[i])? e[i]: '')+"' name='n'><br />"
        });
        $( "#panel" ).html( str );
    });

    $('input').change(function(event) {
        alert('hi');
    });

});
</script>
<br />
<hr />
<input value="sdsd" type="text" /> This is orginally created and works fine, but the generated above do not work with change event

这是在线工作DEMO。