Hiding/showing a paragraph

[phppup]

Just toying with CSS to get a result I've usually used JavaScript to achieve.

I want to toggle a paragraph's visibility when a checkbox is clicked.

   .toggle input:checked {
     p { display: none; }
    }

Obviously incorrect.

Also, are there any pro/cons to using CSS over JavaScript?

Edited July 17, 2023 by phppup
Clean up post

[requinix]

Let me put it this way: you can't use Javascript to show or hide something without also using CSS.

[phppup]

So what do I need to do here so that CSS will toggle my paragraph on its own?

Edited July 17, 2023 by phppup

[requinix]

Given that the CSS you wrote is invalid and what you're trying to do isn't supported,

Either restructure your HTML so that the input and your <p> are sibling elements, thus allowing you to use ~ or +, or use Javascript to apply a CSS class somewhere useful or to show/hide the paragraph element itself.