JSFiddle - React, Tailwind, and code Playground

HTML

<textarea rows=10 cols=90 id="check" oninput="run()"></textarea>
<div id="validity" class="invalid">
</div>

CSS

#validity {
  white-space:pre;
}
.valid {
  color: green;
}
.valid:before {
  content: "Valid\A";
}
.invalid {
  color: red;
}
.invalid:before {
  content: "Invalid\A";
}

JavaScript

function run() {
	var validChars = "0 $&*?ABCDEFGIJKLNPQRSTUXYZ\\`gjkqwxyz{}÷≤≥=║_";
  var content = document.getElementById("check").value;
  var valid = false;
  if(content.length == 0) {
    content = "\t";
  }
  var invalid = [];
  var full = true;
  for(var j = 0; j < content.length; j++) {
    valid = false;
    for(var i = 0; i < validChars.length; i++) {
    	if(content[j] == validChars[i]) {
	    	valid = true;
      	break;
    	}
		}
    if(!valid) {
      full = false;
      invalid.push(content[j]);
      validity.classList.remove('valid');
      validity.classList.add('invalid');
    }
  }
  validity.innerHTML = "";
  for(var i = 0; i < invalid.length; i++) {
    validity.innerHTML += "Invalid character: <code>" + invalid[i].replace("\n", "\\n") + "</code></br>";
  }
  if(full) {
  	validity.classList.add('valid');
  	validity.classList.remove('invalid');
  }
}