One of my JavaScript functions is generating error messages, and I'm looking to enhance it with some CSS. My goal is to give the error message a yellow background and red text color.
//targeting elements
let btn = document.getElementsByClassName("buttons");
let D = document.getElementsByClassName("div_text");
let errorMessage = document.createElement("div");
stringLength = document.getElementById('username');
const regex = /\W/;
errorMessage.id = 'warning';
D[0].appendChild(errorMessage);
stringLength.addEventListener('input', function (evt) {
if (stringLength.value.length > 10) {
document.getElementById('warning').innerText = "The maximum character limit allowed is 10";
btn[0].disabled = true;
}
});