Here\'s the code:
const test = Array.from(document.getElementsByClassName(\'mat-form-field-infix\'));
test.forEach((element) => {
element.outerHTML =
When you set the outerHTML, you're destroying the original element that was there. So, your styling doesn't work.
You'll notice that if you change it to set innerHTML, your styling does work.
This does not do the same exact thing, but I hope it points you in the right direction.
const test = Array.from(document.getElementsByClassName('mat-form-field-infix'));
test.forEach((element) => {
element.innerHTML = ''; // Please note that this line works fine!
element.style.padding = '10px';
element.style.borderTop = '0';
});