Adding jquery function

Hi,

I’m trying to add a show and hide button in a wrodpress post using jquery code that I’ve entered into the whoop options but I’m not sure if I’m adding everything into the correct place.

Here’s the Jquery code I put into Whoop options:

$(“#hide”).click(function(){
$(“timeperiods”).hide();
});
$(“#show”).click(function(){
$(“timeperiods”).show();
});

Here are the buttons i’ve added on a wordpress post

<button id=”hide”>Intermediate</button> <button id=”show”>Basic</button>

Here is an example of the text in my wordpress post that I would like to hide/show:

<div id= timeperiods>(0:29)</div>

When either of the buttons are clicked they don’t do anything so hope you can help.
thanks