Change CSS properties of the element which doesn't exists yet

Question

I want to style the elements which are created after the form submission. The form itself is created by the JS script and I don't have access to it. I already managed to get it working using setInterval

Is there some better solution?

setInterval(function () {
 if (document.querySelector('.submitted-message')) {
 document.querySelector('.submitted-message').style.cssText = "display: flex; font-size: 20px"
 }
}, 100);

• Siddharth Shyniben: There is absolutely no problem with this. It is clearly readable

Answer 1

Yes. Create a CSS class that is loaded by default:

.someClass{
 color:red;
}

and when you create your new elements, make sure that their class attribute contains someClass.

EDIT It looks like the elements already have a class of submitted-message, so just create a CSS rule to target that class:

.submitted-message{
 display: flex; 
 font-size: 20px
}

right?