How to implement a checkbox status check and perform an action?

Question

JavaScript

Hello.

The question has probably come up many times. But I couldn't find a good example.

It is necessary that when the radio button for example with (id="one1") is selected, the block with the class for example (class="main-block") is hidden. And when not selected, respectively, it is not hidden.

I hope for a competent answer from a specialist.

Sincerely!

Answer 1

$("#one1").on("click", function() {
  if ($("#one1").prop("checked"))
  {
    $(".main-block").css("display", "none");
  }
  else
  {
    $(".main-block").css("display", "block");
  }
});

Example

Answer 2

if($('#one1').prop('checked')) $('.main-block').hide();

Answer 3

In my opinion, this is more concise, and everywhere in the examples on JQ, just such an example is given:

if($('#one').is(':checked')) {
  $('.main-block').hide();
}
else {
  $('.main-block').show();
}

PS Which one works faster I didn’t check it, if anyone checked it, plz, I’m interested)