I want to drop the code in a paragraph on every element it clicks on, but when I do that it returns [object html] to me.
How to display the tag in text (the tag itself)
document.addEventListener('click', function(e) {
e = e || window.event;
var target = e.target || e.srcElement,
text = target.textContent || target.innerText;
document.getElementsByClassName("html-tag-element-picker")[0].innerHTML=target;
}, false);
If i understand correctly you want to display the element tag a user clicks in your element, something like this? Or maybe you want everything, updated answer:
document.addEventListener('click', function(e) {
e = e || window.event;
var target = e.target || e.srcElement,
text = target.textContent || target.innerText;
document.getElementsByClassName("html-tag-element-picker")[0].innerHTML =e.target.outerHTML;
}, false);
span {
background: red;
}
p {
background: green;
}
<xmp class="html-tag-element-picker"></xmp>
<span>span el</span>
<p>p el</p>