Jquery height issue

[rajeesh_rsn]

Hi friends,

I want to change content of one of div using jquery and animate the div height and width according to new height and width.

I want to change about 12 contents. Everything working fine with my code except height issue. My question is how to calculate newly loaded contents height dynamically

Please help me

I wrote code as this :

$('.accMenu li').click(function(){
    var win=this.title;                        
        $('#mainWin').animate({"opacity":"0"},700,function(){
                                                           
        $('#mainWin').html("Loading");
        data(win);
                                                           });
        
      });
function data(fun){
    $('#mainWin').html('<div id="password" ><div class="accWinTitle">Change Password</div><table width="650" border="0" cellspacing="0" cellpadding="0" style="float:left;"><tr><td width="25" height="40">&nbsp;</td><td width="115" height="40" align="left">&nbsp;</td><td width="16" height="40" align="left">&nbsp;</td><td width="272" height="40" align="left">&nbsp;</td><td width="222" height="40" align="left">&nbsp;</td></tr><tr><td height="30">&nbsp;</td><td height="30" align="left">Current Password</td><td height="30" align="left">:</td><td height="30" align="left"><input name="textfield3" type="password" class="accTextFileld" id="textfield3" /></td><td align="left">&nbsp;</td></tr><tr><td height="30">&nbsp;</td><td height="30" align="left">New Password</td><td height="30" align="left">:</td><td height="30" align="left"><input name="textfield4" type="password" class="accTextFileld" id="textfield4" /></td><td align="left">&nbsp;</td></tr><tr><td height="30">&nbsp;</td><td height="30" align="left">Confirm Password</td><td height="30" align="left">:</td><td height="30" align="left"><input name="textfield5" type="password" class="accTextFileld" id="textfield5" /></td><td align="left">&nbsp;</td></tr><tr><td height="45">&nbsp;</td><td height="45" align="left">&nbsp;</td><td height="45" align="left">&nbsp;</td><td height="45" align="left"><input name="button" type="submit" class="accSubmitBtn" id="button" value="Save" /><input name="button2" type="submit" class="accSubmitBtn" id="button2" value="Cancel" /></td><td height="45">&nbsp;</td></tr><tr><td>&nbsp;</td><td>&nbsp;</td><td>&nbsp;</td><td>&nbsp;</td><td>&nbsp;</td></tr><tr><td>&nbsp;</td><td>&nbsp;</td><td>&nbsp;</td><td>&nbsp;</td><td>&nbsp;</td></tr></table></div>');
    $('#mainWin').height('10px');
    $('#mainWin').width('50px');
    $('#mainWin').css('opacity',1);
   
    $('#mainWin').animate({'height':'300px'},1000,function(){
        $('#mainWin').animate({'width':'700px'},2000);
                            //alert("ALL Done");                         
                                                     });
    //$('#mainWin').height('0px');
    //$('#mainWin').width('0px');
    
       
    }

[RAJEESH]