CODEWITHSUNDEEP
javascript
Checked rs
Checked rs

Reputation: 91

How to insert an element when its available?

I'm struggling on write my code. What I am trying to do:

Expected Result

var myVar = setInterval(breakdown, 2000);
/*

var myVar1 = setInterval(random, 1000);

function random() {
  var n = Math.floor((Math.random() * 10) + 1);
  let loops = Array.from(document.querySelectorAll('.show'));
  for (const loop of loops) {
    if () {
      loop.innerHTML = n;

    }
  }
} 

*/

function breakdown() {

  let elems = Array.from(document.querySelectorAll('.demo'));
  for (const elems1 of elems) {
    let d = Math.random();

    if (d < 0.50) {
      let str = "Available";
      text = str.fontcolor("green");
      x = true;
    } else {
      let str = "Not Available";
      text = str.fontcolor("red");
      y = false;
    }
    elems1.innerHTML = text;
  }

}
<p id="demo1" class="demo">
  <p id="show1" class="show"></p>
  <p id="demo2" class="demo">
    <p id="show2" class="show"></p>
    <p id="demo3" class="demo">
      <p id="show3" class="show"></p>

Upvotes: 0

Views: 48

Answers (1)

Aaron Tee
Aaron Tee

Reputation: 91

In order to read other elements' (such as sibling in this case) state ('Available' or 'Not Available') for switching work, you can call the previousSibling of the target property then access its innerHTML. Read more about previousSibling dom property. https://www.w3schools.com/jsref/prop_node_previoussibling.asp

fiddle

Upvotes: 1

Related Questions