Append div 到 Angular 中的隐藏元素使用 jquery

Question

I have this div

 <div class="col-md-4 solution" *ngIf="show">

 </div>

which is by default hidden now on button click i want to show that div and append another div to the solution div hide and show is working but append is not working for elements that are hidden.

   this.show=true;
   let area = $(".solution");
   let Detail = `<div class="class-1"> 
        <p>Text<p>
        </</div>`;
    area.append(Detail); 

Any solution to append the div. Thanks

Answer 1

The .class selector selects all elements with the specific class.

area is a collection of elements

 var _that=this;
 setTimeout(function(){      
   if($(".solution") && _that.show == true){// If solution div is visible/shown
    let area = $('.solution:first')
    let Detail = `<div class="class-1"> 
    <p>Text<p>
    </</div>`;
    area.append(Detail); 
 }}, 200);

you need to append over the targeted div by element at index .