CSS hover property not added with elements created with javascript

Hi,
My problem is that for new elements added dynamically with jQuery, the css :hover property is not applying to them even if they have the same class. How can I apply it to them aswell?

#mainHeader .Navigation:hover{
    background: black;
}

When I create my elements with jQuery, the class Navigation is added and the css is correctly applied, except for the :hover function. Why?

Can we see your jQuery code, as well? Seeing how the element is being created may be helpful.

 let newJumpBtn = $("<a>", {class:"Navigation", id:Categ+"Header", href:"#"+categ2+"Jump"});
            let beforeAddBtn = $("#addBefore");
            newJumpBtn.text(Categ);
            newJumpBtn.css("background-color", TitleColor);
newJumpBtn.insertBefore(beforeAddBtn);