JSFiddle - React, Tailwind, and code Playground

HTML

<!DOCTYPE html>
<html>
<head>
<title>XSS Filter</title>
<script>
function f()
{
var x=document.forms["myForm"]["t"].value;
var s=test(x); 
if(x==null || x.length === 0)
{
alert("Fill Form ...");
return false;
}
else
{
document.getElementById("outputhere").innerHTML=s;
return false;
}

}
</script>
<script>

function test(string) {
        var match = /<script[^>]*>[\s\S]*?/i.test(string) ||
 /[\s"\'`;\/0-9\=\x0B\x09\x0C\x3B\x2C\x28]+on\w+[\s\x0B\x09\x0C\x3B\x2C\x28]*=/i.test(string)  ||
 /(?:=|U\s*R\s*L\s*\()\s*[^>]*\s*S\s*C\s*R\s*I\s*P\s*T\s*:/i.test(string) || 
 /%[\d\w]{2}/i.test(string) ||
 /&#[^&]{2}/i.test(string) || 
 /&#x[^&]{3}/i.test(string) ||  
 /&colon;/i.test(string) ||
 /[\s\S]src[\s\S]/i.test(string) ||
 /[\s\S]data:text\/html[\s\S]/i.test(string) ||
 /[\s\S]xlink:href[\s\S]/i.test(string) ||
 /[\s\S]base64[\s\S]/i.test(string) || 
 /[\s\S]xmlns[\s\S]/i.test(string) ||
 /[\s\S]xhtml[\s\S]/i.test(string) || 
 /[\s\S]href[\s\S]/i.test(string)  || 
 /[\s\S]style[\s\S]/i.test(string) ||
 /[\s\S]formaction[\s\S]/i.test(string) ||
 /[\s\S]@import[\s\S]/i.test(string) || 
 /[\s\S]!ENTITY.*?SYSTEM[\s\S]/i.test(string) ||
 /[\s\S]pattern(?=.*?=)[\s\S]/i.test(string)  ||
 /<style[^>]*>[\s\S]*?/i.test(string) ||    
 /<applet[^>]*>[\s\S]*?/i.test(string) || 
 /<meta[^>]*>[\s\S]*?/i.test(string) || 
/<form[^>]*>[\s\S]*?/i.test(string) ||
/<isindex[^>]*>[\s\S]*?/i.test(string) ||
 /<object[^>]*>?[\s\S]*?/i.test(string) || 
 /<embed[^>]*>?[\s\S]*?/i.test(string);
        return match ? 'Filter has catch your awesome vector ... Try hard  :(' : string;
}
</script>
</head>

<body>
	<br /><br /><br />
<h1 align="center">Demo where simple tags are allowed ... (WYSIWYG editor&apos;s functionality)</h1>
        
        	
<div align="center">
  <form name="myForm" method="get" action="?" onsubmit="return f();">
					<textarea name="t" rows="10" cols="90"></textarea>
					<input type="submit" value="Submit">
  </form>
</div>

<div align="center">
</div>

  Output...