CODEWITHSUNDEEP
javascripthtmlcss
Bart
Bart

Reputation: 767

Change text of a div by if statement Javascript

I'm not really skilled with javascript and I want to add text to a div when a variabel is 1 or 0. I'm not sure if a function is necessary. I'm trying it like this: 

var alertt = document.getElementById('Alert');

if(:="OUT_MachineActive": == 1) // Value that gives 1 or 0 
{
    alertt.style.backgroundColor = 'green';
    alertt.firstChild.data = "NO ERROR";
}
if(:="OUT_MachineActive": == 0)
{
    alertt.style.backgroundColor = 'red';
    alertt.firstChild.data = "ERROR!!! Shredder1 is off!";
}


</script>

the div

It's working but the text, I would like to have the text "Shredder1 is off!" on the 2nd line. Like this: ERROR!!!!
Shredder1 is off!

I already tried something like:

  alertt.firstChild.data = "ERROR!!!" + <br /> + "Shredder1 is off!";

But that isn't working.

Upvotes: 0

Views: 2522

Answers (2)

jifar hunde
jifar hunde

Reputation: 1

var error = 1;
$showErr = $('#show-error');
if (error === 0) {
  $showErr.css('background-color', 'green');
  $showErr.html('No Error!');
} else {
  $showErr.css('background-color', 'red');
  $showErr.html('Error!<br>Some Text');
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="show-error">
</div>

Upvotes: 0

Prathik Rajendran M
Prathik Rajendran M

Reputation: 1162

You can use jQuery and do it.

var error = 1;
$showErr = $('#show-error');
if (error === 0) {
  $showErr.css('background-color', 'green');
  $showErr.html('No Error!');
} else {
  $showErr.css('background-color', 'red');
  $showErr.html('Error!<br>Some Text');
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="show-error">
</div>

While using jQuery is optional it would make your development a lot easier.

The line break works here because I am passing it as a html string and that gets inserted into the DOM.

Upvotes: 1

Related Questions