Hiding elements using external JavaScript

Hello!  Hopefully an easy question here.

I have buttons in Captivate 9 that I need to hide/show using an external JavaScript that comes from an imported HTML5 animation.

Currently, I am trying to do it in this manner (although unsuccessfully):

The next button is named "next_button_2" since it's on slide #2.

Inside of index_scorm.html I added a function:

     function disableNext()

     {

          var slideNumber = window.cpApIInterface.getCurrentSlideIndex(); //to get the current slide number

          var nextButton = $("#next_button_" + slideNumber);

          //then I tried using code like nextButton.style.visibility  = "hidden"; or nextButton.hide(); etc, but nothing seems to take.  I'm sure I'm not pointing to the element           properly.

     };

Inside imported HTML animation I have the following code:

     window.onload = function disableButton()

     {

          parent.disableNext();

     };

I know the functions are talking to each other as I've experimented with passing variables, I know the slideNumber variable is assigning a right number.

How do I point to the right object to hide/unhide it?

Thank you!