How do I hide an element using jQuery?

I am trying to hide a particularly stubborn element through jQuery but I am not succeding.

URL: http://temp.organization.events/event/a-tutto-anca

If you scroll towards the bottom of the page there are several similar items. Each has two buttons below: "Approfondisci" and "Scopri i relatori". Basically I want every first button with text: "Approfondisci" in it to be hidden always.

The code I am trying to use is:
jQuery( ".speakers" ).each(function( index ) {
    jQuery('.speaker .speaker-content .btn:nth-child(1)').hide();
});

Open in new window


I even separately tried via css: a:contains('Approfondisci'){display:none;}
but that doesn't work either.

What am I doing wrong? Please assist.

Thanks in advance
badwolfffAsked:
Who is Participating?
 
Rainer JeschorCommented:
Hi,
this works (tested in Chrome Dev Tools console):
$("div.speaker-content > a.btn:contains('Approfondisci')").hide();

Open in new window

HTH
Rainer
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

All Courses

From novice to tech pro — start learning today.