I somewhat understand how to add elements with text to an HTML document using JavaScript. I'm just looking for a way to add an id/class to an element that is created from a function that's triggered by a event attribute in a form.
I want to display the following:
#error {
border: 0.5em red solid;
}
#correct {
border: 0.5em green solid;
}
<p id="error"> Must have at least one checkbox checked</p>
<p id="correct"> At least one checkbox is checked</p>
Please provide an example function that's triggered by an onsubmit event attribute utilized in a form element.
You can add a class to an element using classList.add. Here is an example:
HTML File
.errorStyle {
border: 0.5em red solid;
}
.correctStyle {
border: 0.5em green solid;
}
<p id="error"> Must have at least one checkbox checked</p>
<p id="correct"> At least one checkbox is checked</p>
<button onclick="change()">Submit</button>
JS Function
function change() {
var element = document.getElementById("error");
element.classList.add("errorStyle");
element.classList.add("correctStyle");
}