Cannot get the dynamic selector ID when using onchange

Question

I am trying to pass the input value of textbox and the id (var i) into this function (doSomething).

Result I am getting for 'i' is always 10. So I am assuming it goes through the loop 9 times before passing the i value. However I want this value to be passed on the selected cell.

Many Thanks!

HTML Snippet

<form method="GET" id="game_form"></form>
<table border="1" style="background-color:#FFFFCC;border-collapse:collapse;border:1px solid #FFCC00;color:#000000;width:100" cellpadding="3" cellspacing="3">
  <tr>
    <td id="cell_1"><input type="text" id="input_1" form="game_form"></td>
    <td id="cell_2"><input type="text" id="input_2" form="game_form"></td>
    <td id="cell_3"><input type="text" id="input_3" form="game_form"></td>
  </tr>
  <tr>
    <td id="cell_4"><input type="text" id="input_4" form="game_form"></td>
    <td id="cell_5"><input type="text" id="input_5" form="game_form"></td>
    <td id="cell_6"><input type="text" id="input_6" form="game_form"></td>
  </tr>
  <tr>
    <td id="cell_7"><input type="text" id="input_7" form="game_form"></td>
    <td id="cell_8"><input type="text" id="input_8" form="game_form"></td>
    <td id="cell_9"><input type="text" id="input_9" form="game_form"></td>
  </tr>
</table>

Javascript Snippet

$(window).load(
    function checkInput() {
        var i = 1;
        while (i<10) {
            var $gameMove = $('#input_'+i);
            $gameMove.on('change', function () {
                // Store the current value on focus and on change
                doSomething(this.value, i);});
            i++;
        }

    }
);

function doSomething(content, cell){
    alert(content + ' ' + cell);
}