Javascript 动态创建一个select，然后更改ajax调用以附加html

我使用添加选项卡功能进行导航，同时，添加选项卡内容div将填充一个选择框。现在，从更改时选择框的选项中，将调用相应的表单并附加到页面

index.php

<ul id="myTab" role="tablist">
          <li role="presentation"><a href="#q1"  role="tab" >Form 1</a></li>
          <li><a href="#" class="add-contact" >Add Forms</a></li>
</ul>

---

现在，我需要的是更改使用ajax调用添加表单所需的选项，并将其附加到div选项卡内容中。

正如注释中所指出的，您必须为

选择上的
更改
事件委派事件处理程序。这是因为
select
位于初始创建DOM后修改/添加的内容中

$(document).ready(function(){
    $(document).on('change', 'select', function(){
        $.ajax({ 
            url: "htmlforms.php", 
            context: document.body, 
            success: function(html){
            $("#contentForm").append(html);
        }});
    });
});

什么不起作用？你期望的是什么？仅供参考，
select
event attachment看起来是这样的。在更改选择框中的选项时，不会从调用ajax，最终也不会附加formDelegate事件处理程序，请参阅我最后一条评论中的链接（）@George你能不能编辑你想要我添加的代码，示例链接中没有理解。
$( document ).ready(function() {
$('select').bind('change', function(){
      $.ajax({ 
    url: "htmlforms.php", 
    context: document.body, 
    success: function(html){
    $("#contentForm").append(html);
  }});
});});

$(document).ready(function(){
    $(document).on('change', 'select', function(){
        $.ajax({ 
            url: "htmlforms.php", 
            context: document.body, 
            success: function(html){
            $("#contentForm").append(html);
        }});
    });
});