タッチイベントをforループで作った場合

最近は勉強も兼ねてjavascriptを触っている。

今日試したのは以下の文。

for(var i = 0; i < 16; i++){

   document.getElementById('id'+i).addEventListener('click', function() {

      checkPosition(i);

   });

}

 こんな風にしたときに、関数に渡したiが上手くいかない模様。

要はそのidがタッチされたらその位置を調べて欲しいんだが、良く分からない状態になっている。

コンソールに表示してみたら、i=16になっていた。

なんじゃそりゃ。

横着せずに1つずつタッチイベントを作るべきか。