JSFiddle - React, Tailwind, and code Playground
HTML
<span id="svgWrap">
<svg id="svg"></svg>
</span>
<div id="div"></div>
<a id="a"></a>
<div id="nonElements"></div>
JavaScript
function isElement(element) {
// works on major browsers back to IE7
return element instanceof Element;
}
// set all elements into HTML
var svg = document.getElementById('svg');
var svgWrap = document.getElementById('svgWrap');
var div = document.getElementById('div');
var a = document.getElementById('a');
var nonElements = document.getElementById('nonElements');
// test on SVG and HTML elements
if (isElement(svg) && isElement(svgWrap)) svgWrap.innerHTML = "Span and SVG are detected"
if (isElement(div)) div.innerHTML = "Div is detected";
if (isElement(a)) a.innerHTML = "A tag is detected";
// test on a variety of non-HTML elements
nonElements.innerHTML = ""
var nonElementArray = [1,true,"text",{},[],0,undefined,false,null];
nonElementArray.forEach(function(x){
if (isElement(x)) nonElements.innerHTML = "Oops! Detected a nonElement"
})
if (nonElements.innerHTML.length === 0) {
nonElements.innerHTML = "Successfully returned false for all non-elements."
}