I have a function createStuff which gets called when the html body is loaded
inside the function is a event listener btn.addEventListener("click", notes);
which calls the notes function
clicking on the button does not display in the console that createStuff is invoked again
expected behavior would be that createStuff console.log would be visible because
the event listener is in createStuff
is there a way to display who invoked the function ?
<body onload="createStuff()">
<div class="container">
<button class="btn" type="button">add</button>
<ul class="list-group"></ul>
</div>
<script src="./function.caller.js"></script>
</body>
function notes() {
console.log("gets called inner ---notes");
// function caller
const li = document.createElement("li");
const liText = document.createElement("textarea");
liText.setAttribute("cols", 12);
liText.setAttribute("rows", 6);
li.appendChild(liText);
const ul = document.querySelector("ul");
ul.appendChild(li);
}
function createStuff() {
const btn = document.querySelector(".btn");
btn.addEventListener("click", notes);
console.trace();
console.log("gets called --- createNotes");
}