If I have a javascript function that loads an error using
document.getElementById("ID").innerHTML = "This is your error";
And I want to stylize it say change the text to a different color, and put the error into a different position, how would I go about doing that? I've been looking around, and cannot find any information.
If I have a javascript function that loads an error using
document.getElementById("ID").innerHTML = "This is your error";
And I want to stylize it say change the text to a different color, and put the error into a different position, how would I go about doing that? I've been looking around, and cannot find any information.
Share Improve this question asked Feb 11, 2015 at 15:33 Jack ParkerJack Parker 5692 gold badges10 silver badges36 bronze badges 5- 2 document.getElementById("ID").style.color="red" – Alexis Peters Commented Feb 11, 2015 at 15:35
- Thanks, but I was told specifically to use CSS is there a way to do that? – Jack Parker Commented Feb 11, 2015 at 15:37
- possible duplicate of Change an element's CSS class with JavaScript – Fabio Antunes Commented Feb 11, 2015 at 15:37
- I never posted this before. – Jack Parker Commented Feb 11, 2015 at 15:38
- And having just looked it's not. – Jack Parker Commented Feb 11, 2015 at 15:39
2 Answers
Reset to default 10As innerHTML suggests you can also add HTML. You could for instance add a span tag with a class that you style via CSS.
JS/CSS and HTML
document.getElementById('error-message').innerHTML = "<span class='error'>my error</span>";
.error {
color: red;
font-size: 24px;
}
<div id="error-message"></div>
Check this out , this answer should suffice to your needs:
document.getElementById("ID").innerHTML = "This is your error";
var sheet = document.createElement('style')
sheet.innerHTML = "div {color:red;overflow:hidden;}";
document.body.appendChild(sheet);
Add the below line to your span
#myspan{float:left;}
Working fiddle:http://jsfiddle.net/0z971bsn/
As you mentioned in the comments , to check for errors you can refer to the answer to this question How to get my forms' Javascript error function to cancel form submission and insert error message?