How to make something disappear at the touch of a button?

Question

I'm trying to make a program where a button is pressed and a css figure disappears revealing something that was behind it, like a big box that disappears and you see it's content (eg: a circle), i was trying to do it with the css property visible turning it to hidden.
I'd rather an actual example of a working program, i tried many things, but in the end i somehow lost progress, couldn't even make a simple change of text color, probably something in the syntax i got wrong and didn't found out what.
If you could also exemplify how to access different css properties through JS (two words like background-color in JS are backgroundColor i guess, but I'd like confirmation on that too, I'm really confused to how it works).
Thanks if you can possibly help with any of these two problems.

Answer 1

Decimis † 𝕯𝖊𝖈𝖎𝖒𝖎𝖘
In your code is enough:
"function touch(){
var blueCircle = document.getElementById('circle');
blueCircle.style.visibility="hidden";
}"

Answer 2

https://code.sololearn.com/W0HG1jLM7HHz/?ref=app

Answer 3

Grasshopper Hell Monkey
Only this css code performs the reveal action:

#wrap:target .box {
background-color: rgba(255,0,0,0);
}

This css makes the upper red square box which its background color is background-color: rgba(255,0,0,0);
turns to transparent upon targeted by the button.

Answer 4

Oh, thanks both of you.

Answer 5

Thanks, but couldn't i reach the same result using the visibility property?

Answer 6

Calviղ
Yes, an option without a script - 5 points.👍

Answer 7

Show your code

Answer 8

https://code.sololearn.com/WJuRbd5T7Ibi/?ref=app

Answer 9

If you want a simpler example:

https://code.sololearn.com/WMLL851hrYSG/?ref=app

Answer 10

Grasshopper Hell Monkey Sure you can. There I switched it to use
visibility="hidden";
instead of
opacity="0";