Show/hide trigger on an interactive Threejs file

on my home page i have a grid with 2 columns, the left column contains a container with text and a tab section and the threejs file is an iframe in an embeded section all the way around the first section of the homepage.

what i want to happen is once clicked on the interacted threejs i want the text and tab to disappear and once clicked out it reapers.

what i tried was a trigger on the html code (hide/show on click) and i added the 1st click to the left column and set the display to none then added a second action to the same and the display to block element.

nothing happens and nothing works, can someone help
(the point of me doing this is for the phone section where they click on the JS file, the text is in the way so id like it for it to disappear then to come back.