Hide p element on second click

Question

I am programming on google using the tampermonkey extension, unfortunaly , I can't use jsquery.

I tried to hide an element on the second click, something like a toggle function.

Here it is :

function HideRanks (zEvent) {
    document.getElementById("UserList").classList.toggle('ButtonClickAction');
}

function ButtonClickAction (zEvent) {
   var zNode       = document.createElement ('p');
    var href1 = "/profile/"+firstuser.nick+"-"+firstuser.id;
    var href2 = "/profile/"+seconduser.nick+"-"+seconduser.id;
    var href3 = "/profile/"+thirduser.nick+"-"+thirduser.id;

    zNode.innerHTML = '<p id="UserList"><a style="background-color:Gold;" href="'+href1+'">'+firstuser.nick+'</a>-'+firstuser.points+' points '+firstuser.rank+'</p><br><p><a style="background-color:Orange;" href="'+href2+'">'+seconduser.nick+'</a>-'+seconduser.points+' points '+seconduser.rank+'</p><br><p><a style="background-color:Gray;" href="'+href3+'">'+thirduser.nick+'</a>-'+thirduser.points+' points '+thirduser.rank+'</p>';
    document.getElementById ("myContainer").appendChild (zNode);

}

Why the HideRanks function doesn't work ?

the html is actually in the zNode.innerHTML , between the both " ' ' " — Hakar, Apr 19 '21 at 11:24
So I need to set attributes to the button itself to call it ? — Hakar, Apr 19 '21 at 11:48
use of inner html can cause event dissaper check this --> https://stackoverflow.com/a/38362030/11492378 — Toxy, Apr 19 '21 at 12:13

score 0 · Answer 1 · answered Apr 19 '21 at 11:54

0

zNode.innerHTML = '<p id="UserList" onclick="HideRanks()">.....</p>';

Try This i have Tested in Jsfiddle its working but may cause problem for you as you are tampermonkey which i am not familiar so please comment if it doesn't work.

answered Apr 19 '21 at 11:54

Toxy

696
5
9

I see your point but unfortunaly it's not working. – Hakar Apr 19 '21 at 12:02

Hide p element on second click

1 Answers1