JSFiddle - React, Tailwind, and code Playground

by slove

HTML

<ul id="results"></ul>

CSS

#results li.pass {
  color: green;
}

#results li.fail{
  color: red;
  text-decoration:line-through
}

JavaScript

function assert(value, desc){
  var li = document.createElement("li");
  li.className = value ? 'pass' : 'fail';
  li.appendChild(document.createTextNode(desc));
  document.getElementById('results').appendChild(li);
}


var outerValue = 'ninja';

var later;

function outerFunction() {
  var innerValue = 'samurai';
  
  function innerFunction(paramValue){
    assert(outerValue, "I can see the ninja.");
    assert(innerValue, 'I can see the samurai');
    assert(paramValue, 'I can see the Wakizashi.');
    assert(tooLate, 'Inner can see the ronin.');
  }
  later = innerFunction;
}

assert(!tooLate, "Outer can't see the ronin.");

var tooLate = 'ronin';

outerFunction();

later('wakizashi');