CODEWITHSUNDEEP
jquery
G-J
G-J

Reputation: 1068

jquery .html('') not working as I expect

I have this code...

$(".loadMsg").load('modalAnsmessages.php?id=<?php echo $row['id']; ?>&t=r',function(){ 
    $('#preloader').fadeOut();
    $(".modal_dialog .content").css({ 'background-color': '#eeeeee' }); 
    setTimeout("$.fancybox.resize();",500);     
});

which works fine. Later I run this code...

$(".p_close").click( function(){
    $(".loadMsg").html('');
    $(".loadMsgOpen").show();
    $(".modal_dialog .content").css({ 'background-color': '#ffffff' });
    setTimeout("$.fancybox.resize();",500);  
});

... that code at first glance appears to run fine; however, I don't think the $(".loadMsg").html(''); is working as I expected. Each time I run the first block of code, each of the previous contents of .loadMSG shows momentarily until it finally gets through all previous instances and stops. Sometimes it stops at the correct one and sometimes not.

What I would like to have happen is that when $(".p_close").click is run, I would like all memory of $(".loadMsg") to be gone. I thought $(".loadMsg").html(''); would do that but apparently I am wrong.

Upvotes: 0

Views: 70

Answers (1)

BinaryTox1n
BinaryTox1n

Reputation: 3556

Try using the empty function instead:

This method removes not only child (and other descendant) elements, but also any text within the set of matched elements.

$(".p_close").click( function(){
    $(".loadMsg").empty();
    $(".loadMsgOpen").show();
    $(".modal_dialog .content").css({ 'background-color': '#ffffff' });
    setTimeout("$.fancybox.resize();",500);  
});

Upvotes: 1

Related Questions