I'n new in Javascript so please excuse me if this is a silly question.
Using Elementor pro, I'm trying to get the post title from a custom post type loop (made with ele custom skin plugin) shown in a posts widget, using javascript (in the client side).
In my loop template, the post title is in a heading title (set with an Elementor dynamic tag). When clicking on it, I should get the title in a variable with something like this:
In the loop:
<script>
var My_Heading = document.getElementById('My_Heading_Id');
My_Heading.onclick = function(event){
//Get the post title
var StPostTitle = document.getElementById('My_Heading_Id').getElementsByTagName('a')[0].firstChild.data;
console.log(StPostTitle);
//Do something with StPostTitle ...
};
</script>
This only works when clicking on the first item in the loop. Clicking on any other item, either gives the same first item PostTitle or gives nothing. Tried with a button instead of heading with same result.
Is there some way to get any specific item title from the loop with javascript (not having to touch server php files)?
Thank you Jcl for the clue.
What I've done is to get the clicked element with the window.onclick event, this way:
window.onclick = e => {
var StPostTitle = e.target.innerHTML;
// .........
}
... and that's what i needed ;)