dynamically resize iframe height based on dynamic content
===

First, I'll give you the structure of my page:

    <html>
    <body>
        <div>
        <iframe>
            <div id="div1">
            </div>
        </iframe>
        </div>
    </body>
    </html>

If only I knew ahead the size of `div1`, there's no problem here. However, I am dynamically adding contents into `div1` using jquery ajax and so I could not pre-set the `<iframe>`'s height.

I've tried the solutions I found in other threads by adding some script in the `onload` of the `<iframe>` but it's useless since the contents are dynamically changing without reloading the page.

Any help?