Two versions of a playButton Binding Audio With a grid link structure

You’re now told that playButton is not a function, and it’s dead right. It needs to be togglePlayButton instead.

Which one, it’s showing me errors.

The playButton(button) line is the bad one.

It’s not the whole line that needs to be togglePlayButton, it’s only the playButton part of it that need to be playButton instead.

Links float

Links float: .style working version:

TypeError: el is null
[Learn More]

   function upTo(el, selector) {
     while (el.matches(selector) === false) {
       el = el.parentNode;
     }
     return el;
   }

Clicking on that one takes me to the show function.

I see that the following line is causing that problem.

show(links.querySelector(".links"));

It shouldn’t be using querySelector there. Instead, it should only be the link variable that is given as an argument to the show function.

You still haven’t fixed that show links line.

var link

or

var links?

var link = upTo(button, ".links");

Neither of those.

It’s the show links line further down that is wrong.

It seems like you aren’t reading my instructions.

yes, no.

show(links);

Not quite.

I don’t understand what that means.

delete this then?
show(link.querySelector(".links"));

Currently you are giving links as an argument to the show function, when it needs to be link that is given as an argument to the show function.

     var link = upTo(button, ".links");
     var player = button.querySelector("audio");
     var play = button.querySelector(".play");
     var pause = button.querySelector(".pause");
     button.classList.add("playing");
     hide(button.querySelector(".initial"));
     show(link.querySelector(".links"));