Question

I have cloned a table (with selects) to copy to somewhere else. This works great and I manage to change the ID’s with no worries. The problem is that if I try to bind a change event to each of them, will it never fire? Is there a obvious mistake here? Thank you.

<script type="text/javascript">
            $(document).ready(function () {
                var variants = $("table.variantselection").clone(false);

                variants.find("select").each(function (i, o) {
                    $(this).attr("id", $(this).attr("id") + "_popup");
                });

                variants.find("select").change(function () {
                    alert($(this).val()); // never reaches this alert
                });

                variants.appendTo("#popup_variants");               
            });
        </script>

Answer 1

Change false to true to copy the event handlers with the DOM element

var variants = $("table.variantselection").clone(true);

Failing that, use the live() event to bind:

variants.find("select").live("change", function () {
    alert($(this).val());
});