Using AJAX for chained selections

I have a form with two select elements, one is to select a type, and the second is to select an account that belongs to the type selected in the first select element.

In order to enable AJAX in WordPress, I first added the following code to my functions.php.

/**
 * Enable the WordPress AJAX handler
*/
function my_ajax_script() {
     wp_localize_script( 'function', 'my_ajax_script', array( 'ajaxurl' => admin_url( 'admin-ajax.php' ) ) );
}
add_action('template_redirect', 'my_ajax_script');

include_once( dirname(__FILE__) . '/inc/ajax/list_accounts_by_type_as_options.php' );
add_action("wp_ajax_list_accounts_by_type_as_options", "list_accounts_by_type_as_options");

And here’s what list_accounts_by_type_as_options.php contains. It queries all accounts that belong to the selected type and echoes them as options for select.

<?php

function list_accounts_by_type_as_options() {

    $type= $_REQUEST['type'];

    $args = array(
                    'post_type'     => 'account',
                    'post_status'   => 'publish',
                    'posts_per_page'=> -1
                    'meta_query'    => array(
                                          array(
                                                'key'      => '_account_type',
                                                'value'    => $type,
                                                'compare'  => '='
                                                )
                                            )
                );

    $accounts = get_posts( $args );

    foreach( $accounts as $account ) {
    ?>
    <option value="<?php echo $account->ID; ?>" ><?php echo $account->post_title; ?></option>
    <?php
    }

}

Then I built my form as below. The second select has no options elements because I wish they will be dynamically filled up with AJAX.

<form id="form" method="post" action="" role="form" data-toggle="validator">

  <select id="type" name="type" class="form-control" required>
    <option value="type-a"></option>
    <option value="type-b"></option>
    <option value="type-c"></option>
  </select>

  <select id="accounts" name="type" class="form-control" required>
  </select>

</form>

<script type="text/javascript">
jQuery(document).ready(function($) {

    $("#type").change(function() {

         jQuery.ajax({
            url: doumi_ajax_script.ajaxurl,
            data: ( { action : 'list_accounts_by_type_as_options', type: $(this).val() } ),
            success: function() {
                $("#accounts").html(data);
            }
         });

    });

});
</script>

However, I’m not getting anything back into #accounts element – it’s always empty with no options.

Where should I look into?