jqueryで動的に出力したhtmlでのイベントを受け取る

最近今更ながらjqueryをがりがり書いていて、
それで久々にはまったのでメモ。
こういうプルダウンがあって、選択した値をもとに何か処理を行いたいとき、

<select id="test1" name="select1">
 <option value="1">no1</option>
 <option value="2">no2</option>
 <option value="3">no3</option>
</select>

最初から出力されてるプルダウンだとこの書き方で実行されるけど、

$('select[name="select1"]').change(function(){
  alert($('#test1').val());
});

動的に出力したプルダウンだと実行されなくて、
この書き方にしないと実行されなかった。

$(document).on('change','select[name="select1"]',function(){
  alert($('#test3').val());
});

動的にhtml書き出しているからそうといえばそうだけど、 意外な盲点でした。
githubにもサンプルコードあげました。
https://github.com/syakasyaka/html/blob/master/jquery-dynamic-on.html