insertAdjacentHTML jak naprawić opóźnienie w wyświetlaniu

Dzień dobry,

Na stronie jest zaimlementowany prosty preloader jquery

jQuery(window).ready(function($) {
     $("#loader-wrapper").fadeOut("fast");
});

Chciałbym wrzucić content w pewne miejsce, poniższy kod działa idealnie

jQuery(function($){
$('.classname').append('Inserted');
});

Natomiast przy tym kodzie Inserted pojawia się chwilę po załadowaniu strony, widoczny jest brzydki przeskok

function widgetMenu() {
let el = document.querySelectorAll('.classname');
let htmlString = "Inserted";
el[0].insertAdjacentHTML('afterend', htmlString);
}
window.onload = widgetMenu;

Dlaczego w jquery nie ma takiego przeskoku natomiast w czystym js jest i jak to naprawić żeby Inserted został dodany przed wyłączeniem preloadera?

Najprościej ten ostatni fragment kodu również podpiąć przez jquery, a nie bezpośrednio do window, a dlaczego tak się dzieje masz dokładnie opisane w dokumentacji jquery:
https://api.jquery.com/ready/

W skrócie: load jest odpalane po ready.

To dlaczego nie odpalasz funkcji od razy podczas wczytywania js, tylko po wczytaniu okna?
widgetMenu();

A faktycznie, addEventListener z DOMContentLoaded rozwiązał problem