'remove a block HTML with javascript

I use owl-carousel in a project angularjs I try to reinit owl-carousel after data-change with $(element).data('owlCarousel').destroy(); and remove this block:

<div class="owl-wrapper">
<div class="owl-item" ></div>
<div class="owl-item" ></div>
<div class="owl-item" ></div>
<div class="owl-item" ></div>
<div class="owl-item" ></div>
</div>

I try this:

 if(typeof $(element).data('owlCarousel') != 'undefined'){
                        $(element).data('owlCarousel').destroy();
                        $(element).find(".owl-item").removeClass("owl-item");                   
                    }

ON page load It's working fine but on data change it's not working for exemple I have 5 items to display then I shoud get 5 block <div class="owl-item" ></div> but I get my 5 items expected and more empty block .

Solution 1:^[1]

You can remove the whole element like this:

const remove = el => el.parentElement.removeChild(el);

const owl = document.querySelector('div.owl-wrapper');

// remove it

remove(owl)

// check if it's removed (true = no such element in DOM) 

console.log(document.querySelector('div.owl-wrapper') === null)

<div class="owl-wrapper">
<div class="owl-item" >1</div>
<div class="owl-item" >2</div>
<div class="owl-item" >3</div>
<div class="owl-item" >4</div>
<div class="owl-item" >5</div>
</div>

Solution 2:^[2]

have you tried using

$(".owl-item").removeClass("owl-item");

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution	Source
Solution 1
Solution 2	MoTahir

'remove a block HTML with javascript

Solution 1:[1]

Solution 2:[2]

Sources

Related Questions

Solution 1:^[1]

Solution 2:^[2]