CODEWITHSUNDEEP
jqueryjavascript-objects
Biomehanika
Biomehanika

Reputation: 1540

Unable to select object not part of the initial DOM

I have a piece of HTML inserted dinamically with jQuery, by using the .html() method when user clicks on '.acceptExtra':

HTML:

<div class="tripleButtonsWrap">
   <div class="tripleButtonsC">
        <div class="acceptExtra">
        ............
        </div>
   </div>
</div>

jQuery:

$(document).on('click','.acceptExtra', function(){
            closeExtras();
    });

function closeExtras(){            
    $(document).find('.tripleButtonsC').fadeOut(400,function(){
        $(this).remove();
        $('.tripleButtonsWrap').html(initialCode); //HTML PIECE INSERTED
        $(document).find('.tripleButtonsC').fadeIn(600);   
    }); 
}

The initialCode variable stores the HTML containing the '.acceptExtra' button, and as it is called by a delegate (on('click','.acceptExtra', function()...) it works properly again and again.

But the '.tripleButtonsC' only fades out the first time closeExtras() is executed. Next times it is not recognised by jQuery and so the entire closeExtras() function does nos apply.

I have tried selecting it by using the $(document).find('.tripleButtonsC')... with no positive result.

How can I make it being selected again by jQuery?

Upvotes: 2

Views: 39

Answers (1)

dsharew
dsharew

Reputation: 10665

I guess this is why it is not working:
Just before executing the function you have this dom: 

<div class="tripleButtonsWrap">
   <div class="tripleButtonsC">
        <div class="acceptExtra">
        ............
        </div>
   </div>
</div>

But after executing the closeExtras function ( ('.tripleButtonsWrap').html(initialCode); ) you will have this dom: 

<div class="tripleButtonsWrap">
     <div class="acceptExtra">
        ............
      </div>
</div>

Because the initialCode variable does not contain the div with class tripleButtonsC.

To make sure the div with class tripleButtonsC is not there inspect your html using google developer tool.

Upvotes: 2

Related Questions