jquery Select2 4.0 trigger('change') does not work

var $element = $("#genre").select2({
            placeholder: "select genre",
            maximumSelectionLength: 3,
            ajax: {
                url: function (params) {
                    return "/score/search_genre/"+params.term
            },
            dataType: 'json',
            delay: 250,
            processResults: function (data) {
                var select2Data = $.map(data.genre, function (obj) {
                    obj.id = obj.code;
                    return obj;
                });
                return {
                results: data.genre
              };
            },
            cache: false
            },
            escapeMarkup: function (markup) { return markup; }, // let our custom formatter work
            minimumInputLength: 1,
            templateResult: genreSelectFormat, // omitted for brevity, see the source of this page
            templateSelection: function (data) { return data.genre_kr; }
        });

$element.trigger('change');


<select name="genre[]" id="genre" style="width:70%" multiple>
  <?php foreach($genres as $genre) { ?>
     <option selected="selected" value="<?=$genre?>"><?=get_genre_nm($genre)?></option>
  <?php } ?>
</select>

I'm using select two multiple selection with ajax

there's no problem when I does not use with ajax

but with ajax initial option's text does not show up like below

now : ([ⓧ] [ⓧ] [ⓧ] ) <-- options without text

i want : ( [default1ⓧ] [default2ⓧ] [default3ⓧ] ) <-- proper result

php foreach loop prints result well

I don't know what I did wrong