javascript - Google api http リクエストに動的変数を使用する

Question

フォームは、アドレス変数に収集されているユーザー入力を取得するように設定されています。jQuery を使用して、URL 要件ごとにアドレスをシリアル化します。jquery serialize getJSON を使用してリクエストを Google geocode API に送信します。for ループ内で for in ループを使用して、結果を実行します。最後に、JSON の結果にアクセスします。

質問: なぜundefined結果が得られるのですか?

コード：

$(function() {
    var address = document.getElementById('address').value;
    address += " "+document.getElementById('street_add').value;
    address += " "+document.getElementById('city').value;
    address += " "+document.getElementById('state').value;
    address += " "+document.getElementById('postcode').value;   

    $('#clickme').click(function() {
        var strAddress = $( "address" ).serialize();
        // data is an object containing info also called a map key/values
        $.getJSON("http://maps.googleapis.com/maps/api/geocode/json?address=strAddress&sensor=false", function( data ) {
            for (var i = 0; i <= data.length; i++) {
                for (key in data.results[i]) {
                    var mystring = data.results[0].formatted_address;
                    var mylat = data.results[0].geometry.location.lat;
                    var mylng = data.results[0].geometry.location.lng;
                } 
            }

            $("<ul/>", {
                "class": "zombies",
                html: document.write(mystring,'<hr />', mylat, '<hr />', mylng),
            }).appendTo( "body" ); 
        });
    });
});