LoadingOverlay iterate many overlays and hide programmatically

Question

I'm working with this libraray https://gasparesganga.com/labs/jquery-loading-overlay/

Example: To show an overlay for an element:

$("body").LoadingOverlay("show", {});

Example: To hide an overlay for an element:

$("body").LoadingOverlay("hide", true);

I can call hide and show explicitly and it will work as expected.

I want to iterate over all overlays and hide them programmatically. What I tried doesn't work.

I appreciate any assistance you can provide. Thank you as always!

`

$("body").LoadingOverlay("show", {});
$("#scotty").LoadingOverlay("show", {});

////These work when explicitly called
//$("body").LoadingOverlay("hide", true);
//$("#scotty").LoadingOverlay("hide", true);

//I want to interate over all overlays and hide them programatically. 
//This code will not hide the overlays.
$(".loadingoverlay").each(()=>{
    $(this).LoadingOverlay("hide", true);
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.1/jquery.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/loadingoverlay.min.js"></script>

<img id="scotty" src="https://i.imgflip.com/1pg0vt.jpg" alt="" width="300">

`Hi, I have a list of nodes that

Answer 1

I was able to contact the developer. We both agree that this method is a "hack" but it works for now. He does not guarantee this method working long term.

Our conversation is here on Github.

$(".loadingoverlay").each((i, el) => {
    // Each .loadingoverlay element stores some data. You can retrieve it using .data("loadingoverlay_data")
    $(el).data("loadingoverlay_data").container.LoadingOverlay("hide", true);
});