let classMessage = document.createElement('class');
document.getElementById("chat").prepend(classMessage);
classMessage.id = tabMsg[0];
classMessage.innerHTML += '<button onclick="del(' + tabMsg[0] + ')">Try it</button>'
function del(parsedata) {
console.log(parsedata)
}
tabMsg is a parsed line (with split).
i dont understand why when i click on the button the output on the console is :
<class id="vuwzbip6dr"><button onclick="del(vuwzbip6dr)">Try it</button><p>gfdgf gdfgf</p></class>
why he dont put the id vuwzbip6dr !!! ?
Encapsulating strings with strings within strings generally causes more problems than it solves and therefore should be avoided.
In your case that means this statement:
'<button onclick="del(' + tabMsg[0] + ')">Try it</button>'is causing the issue for you.That line is interpreted as:
<button onclick="del(v)">Try it</button>Where
vbecomes an identifier pointing to thethis, or thecurrentTargetelement and not a string like this: "dev('v')".Looking at the documentation one sees the
onclickhandler is provided thecurrentTargetas the first argument to the callback - hence the assignment I mention.To fix this you should rely on the tools JavaScript provides - namely, it gives you the
currentTarget(target element of the click), so all you have to do is use that and ask for it's parent element's id attribute:But that isn't recommended either. You should always try to avoid using in-line event handlers. I'll leave that to a different question for you.