jQuery "：selected" filter

Question

ボタンをクリックしたときに動的に追加された選択項目で選択されたオプションの値を取得しようとすると、常に不確定になります。

$(document).on('click', '#ChangeResp', (function(){ 
var test = $(document).find('#responsiblelist'); 
var test2 = $(test).filter(":selected").val(); 
console.log(test2); 
})); 

もし私がconsole.log(test)の場合、正しい要素が選択されています。私はここでSELECT2

を使用してい

EDIT＃1はHTMLコードです。

<div class="form-group is-empty"> 
    <label class="control-label" for="responsiblelist"><strong>Responsible Name</strong></label></br > 
    <select id="responsiblelist" title="Select Responsible" class="select2_single form-control" tabindex="-1"> 
     <option></option> 
     <option value="1"></option> 
     <option value="2"></option> 
     <option value="3"></option> 
    </select> 
</div> 

<script type="text/javascript"> 

$(document).on('click', '#ChangeResp', (function(){ 
    var username = $(document).find('#responsiblelist').children("option").filter(":selected").val(); 
    console.log(username); 
})); 

</script> 

私は常に値を持たない最初のオプションを取得していますので、私は常に未定義取得していた理由は、そうでない場合は、私がすでに選択された一つのオプションで選択開始する（これはSELECT2の使用のための要件である）です。