Check if radio button is selected

Question

I’m unable to verify the following condition:

$("#calculo").click(function() {
  if ($("#opcao2").cheked()) {
    $("#segundoConteudo").css("display", "none")
  }
})

.labelFake {
  font-weight: bold;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<p><span class="labelFake">Opções:</span>
  <label>Opção 1</label>
  <input type="radio" name="perfilCliente" id="opcao1">
  <label>Opção 2</label>
  <input type="radio" name="perfilCliente" id="opcao2">
</p>
<div id="segundoConteudo">
  <p><span class="labelFake">List Drop Down:</span>
    <select>
      <option>Opção 1</option>
      <option>Opção 2</option>
    </select>
  </p>
  <p><span class="labekFake">Selecione o produto:</span>
    <select class="prods">
      <option>Produto...</option>
    </select>
  </p>
  <button id="calculo">Calcular</button>
</div>

In short: I want when the #opcao2 is selected, div "second content" does not appear.

Answer 1

The right thing to do is to use prop:

$("elem").prop("checked");

Instead of:

$("#opcao2").cheked()

$("#calculo").click(function() {
  if ($("#opcao2").prop("checked")) {
    $("#segundoConteudo").css("display", "none")
  }
})

.labelFake {
  font-weight: bold;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<p><span class="labelFake">Opções:</span>
  <label>Opção 1</label>
  <input type="radio" name="perfilCliente" id="opcao1">
  <label>Opção 2</label>
  <input type="radio" name="perfilCliente" id="opcao2">
</p>
<div id="segundoConteudo">
  <p><span class="labelFake">List Drop Down:</span>
    <select>
      <option>Opção 1</option>
      <option>Opção 2</option>
    </select>
  </p>
  <p><span class="labekFake">Selecione o produto:</span>
    <select class="prods">
      <option>Produto...</option>
    </select>
  </p>
  <button id="calculo">Calcular</button>
</div>