jquery - JavaScript in embedded forms -

let's have entity user.

the user can have many address.

in address there's 2 fields :

• country
• state

what want :

• when user create account, can add many address wants.
• when user select country, populate state field based on 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 add address (which 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, now, how add call .change() on select created after clicking on "add address" ?

because if add many address, divs have name :

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

so how select div have .change() call of these divs ? , put javascript ? inside first javascript when add divs ? or outside ?