Why is Jquery returning the wrong length?
<p>I'm using this code to add an element to a form. Then I count the total number of elements with that class. However, Jquery .length returns the number of elements times two.</p>

<p>Any ideas what I'm doing wrong?</p>

<pre><code>$(function () {
    function updateWeight() {
        var z = $("input.count").length;
        alert(z);
    }
    $("#addCatalogItem").autocomplete({
        source: function (request, response) {
            $.getJSON("inventory_auto_complete.php", {
                term: request.term,
                supplier_id: $('#supplier_id').val()
            }, response);
        },
        minLength: 2,
        select: function (event, ui) {
            var q = ui.item.product_id;
            $('#product_id').val(q);
            var r = ui.item.value;
            $('#product').val(r);
            var field = '&lt;label&gt;' + r + '&lt;/label&gt;&lt;input class=\"count\" type=\"text\" value=\"\" name=\"field[' + q + ']\"/&gt;';
            var $item = $("form");
            $(field).appendTo($item);
            updateWeight();
        }
    });
});
</code></pre>

<p>HTML</p>

<pre><code>&lt;form&gt;
    &lt;input type="hidden" id="supplier_id" value="1"/&gt;
    &lt;input id="addCatalogItem"/&gt;
&lt;/form&gt;
</code></pre>
