Autosuggest 不适用于追加

Autosuggest not working with append

我正在使用 jquery 自动建议。 当我尝试添加新的输入字段时,它会添加输入文本框,但不适用于自动建议。 不确定我哪里出错了,我没有收到任何错误。 我可以做些什么来使自动建议与附加一起工作?

<td><button class="add_field_button4">Add </button> </td>
<div class="input_fields_wrap6">
        <input type="text" class="pets"  value="#myArray[listCount]#"/>
        <a  class="remove_field">Remove</a>
</div>
<div class="input_fields_wrap3">

</div>


<script type="text/javascript">

    $(document).ready(function() {
    var max_fields3      = 30; //maximum input boxes allowed
    var wrapper3         = $(".input_fields_wrap3"); //Fields wrapper
    var add_button3      = $(".add_field_button3"); //Add button ID
    var wrapper6         = $(".input_fields_wrap6"); //Fields wrapper
    var x = 1; //initlal text box count
    $(add_button3).click(function(e){ //on add input button click
        e.preventDefault();
        if(x < max_fields3){ //max input box allowed
            x++; //text box increment
            $(wrapper3).append('<div><input type="text" class="pets" name="mytext[]"  ><a href="#" class="remove_field">Removes</a></div>'); //add input box


        } 
    });


    $(document).ready(function() {
        $('.pets').autocomplete({
            source: function(query, response) {
                $.ajax({
                    url: "search.cfc?method=queryNames&returnformat=json",
                    dataType: "json",
                    data: {
                        searchPhrase: query.term
                    },
                    success: function(result) {
                        response(result);
                    }
                });
            }
        });
    });
</script>

尝试:

<script type="text/javascript">

$(document).ready(function() {
var max_fields3      = 30; //maximum input boxes allowed
var wrapper3         = $(".input_fields_wrap3"); //Fields wrapper
var add_button3      = $(".add_field_button3"); //Add button ID
var wrapper6         = $(".input_fields_wrap6"); //Fields wrapper
var x = 1; //initlal text box count
$(add_button3).click(function(e){ //on add input button click
    e.preventDefault();
    if(x < max_fields3){ //max input box allowed
        x++; //text box increment
        $(wrapper3).append('<div><input type="text" class="pets" name="mytext[]"  ><a href="#" class="remove_field">Removes</a></div>'); //add input box


    }

    $('.pets').autocomplete({
        source: function(query, response) {
            $.ajax({
                url: "search.cfc?method=queryNames&returnformat=json",
                dataType: "json",
                data: {
                    searchPhrase: query.term
                },
                success: function(result) {
                    response(result);
                }
            });
        }
    });
});
</script>