javascript - jQuery を使用した iframe の表示と読み込み

Question

ユーザーがボタンをクリックするまで非表示のiframe（同じドメインのフォームを含む）をロードするページがあり、jQuery slideToggle（）を呼び出して表示/非表示にします。
ユーザーがフォームを送信すると、iframe に「ありがとうございました」ページが読み込まれます。その後、ユーザーがボタンをもう一度クリックすると、jQuery は iframe 本体要素の ID をチェックしてフォームが存在するかどうかを確認し、存在しない場合はフォーム iframe をロードして表示します。

私が持っているコードは Chrome で動作しますが、Firefox では機能しません。
コンソールのエラーメッセージ => TypeError: frames['form-iframe'] is undefined
(そして、IE をテストするときに IE を想像します)。

理由、またはこの問題を解決する方法についてのアイデアは大歓迎です。

HTML スニペット

<label id="tell-a-friend-button">
    <div class="radio-button radio-button-grey">
        <div class="label-text">YES</div>   
    </div>
    <span>Tell a friend</span>
</label>

<div id="tell-a-friend">
    <iframe src="me.asp?email=foo" frameborder="0" id="form-iframe"></iframe>
</div>

jQuery スニペット

$("#tell-a-friend-button").click(function(){
    // set iframe content
    $("#form-iframe").ready(function () {
        var frame = $('body', frames['form-iframe'].document).attr('id');
        if (frame == "tell-form") {
            $('#tell-a-friend').slideToggle();
        } else {
            // is the thank you page
            // load the iframe
            $("#form-iframe").attr("src", "me.asp");
        }
    });
});