嵌入式形式的JavaScript

Let's say I have an entity User.

The User can have many Address.

In Address There's 2 fields :

• Country
• State

What I want :

• When the user create his account, he can add as many address as he wants.
• When the user select a Country, it populate the State field based on the country.

What I've done :

UserType :

/**
 * @param FormBuilderInterface $builder
 * @param array $options
 */
public function buildForm(FormBuilderInterface $builder, array $options)
{
    $builder
        ->add('address', 'collection', array(
            'type' => new AddressType(),
            'allow_add' => true,
            'allow_delete' => true))
    //...
}

The Javascript to add address (which is working : based on symfony doc):

<script type="text/javascript">
    $(document).ready(function() {
        var $container = $('div#mybundle_user_address');
        var $addLink = $('<a href="#" id="add_source" class="">Add address</a>');
        $container.append($addLink);

        $addLink.click(function(e) {
            addAddress($container);
            e.preventDefault(); 
            return false;
        });

        var index = $container.find(':input').length;
        $container.children('div').each(function() {
            addDeleteLink($(this));
        });

        function addAddress($container) {
            var $prototype = $($container.attr('data-prototype').replace(/__name__label__/g, 'Address n°' + (index+1))
                .replace(/__name__/g, index));
            addDeleteLink($prototype);
            $container.append($prototype);
            index++;
        }

        function addDeleteLink($prototype) {
            $deleteLink = $('<a href="#" class="btn btn-danger">Delete</a>');
            $prototype.append($deleteLink);
            $deleteLink.click(function(e) {
                $prototype.remove();
                e.preventDefault(); 
                return false;
            });
        }
    });
</script>

Ok, but now, How do I add I call a .change() on the select created after clicking on "add address" ?

Because if you add many address, divs will have this name :

• #mybundle_user_address_0_country
• #mybundle_user_address_1_country
• #mybundle_user_address_2_country
• ...

So how do I select the div to have a .change() call of these divs ? And where do I put the javascript ? Inside the first javascript when I add divs ? Or outside ?