jQuery popup doesn't come up correctly after $("#div_id").dialog();
<p>I have this jQuery function:</p>

<pre><code>$('#invite_friends_email').live('click' , function() 
{
    $("#invite_friends_email").dialog();

    return false;       
});
</code></pre>

<p>and on that page I import that div like this:</p>

<pre><code>&lt;?php
include '../divs/invite_frineds_by_email.php';
?&gt;
</code></pre>

<p>and the div itself looks like this:</p>

<pre><code>&lt;div id="invite_friends_email" style="display: none;"&gt;
    &lt;form method="post" action=""&gt;
    &lt;p&gt;
    &lt;br /&gt;
        &lt;h3&gt;Enter Your Friends Email Addresses (Separated by Comma)&lt;/h3&gt;
        &lt;textarea type="textarea" rows="2" cols="75" name="emails"&gt;&lt;/textarea&gt;
    &lt;/p&gt;
    &lt;p&gt;
        &lt;strong&gt;&lt;h3&gt;Email Subject (Edit subject to add your name so your friends recognize you)&lt;/h3&gt;&lt;/strong&gt;
        &lt;input type="text" name="subject" size="75" value="Your friend wants to invite you to brainstorm problem solutions"&gt;
    &lt;/p&gt;
    &lt;p&gt;
        &lt;h3&gt;Enter Your Message: (Edit the body of the text however you like)&lt;/h3&gt;
        &lt;textarea type="textarea" rows="5" cols="75" name="message"&gt;Here is the URL of the problem:

    http://www.problemio.com/problems/problem.php?problem_id=&lt;?php echo $problem_id; ?&gt;
        &lt;/textarea&gt;
    &lt;/p&gt;
    &lt;p&gt;
        &lt;input type="submit" style="border: none;" alt="Send email!" /&gt;
    &lt;/p&gt;
    &lt;/form&gt;
&lt;/div&gt;
</code></pre>

<p>You can reproduce the current problem by going here:
<a href="http://www.problemio.com/problems/problem.php?problem_id=225" rel="nofollow">http://www.problemio.com/problems/problem.php?problem_id=225</a> and clicking on the "Invite Friend(s) via Email" link.  Right now I can tell that the click function is being called, but not sure why the dialog is not popping up.  Any idea how to make it come up?</p>
