Estou com um problema e gostaria da ajuda dos amigos:
Em uma página de escolha de item gostaria de fazer aparecer uma div que está oculta quando seleciono a opção pelo radio button.
Funciona ok clicando direto no radio button, porém o radio button também é selecionado ao clicar sobre o nome da opção na DIV (exemplo: Boleto Bancário). E quando clico sobre o nome da opção a DIV oculta não aparece.
Gostaria de exibir a DIV oculta tanto ao clicar sobre o nome Boleto bancário (no caso em toda a DIV) como também ao clicar no radio button.
O HTML é mais ou menos assim:
$("input[name=op]").change(function(data){
var selection = $("input[name=op]:checked").val();
console.log(selection);
if(selection != "op3")
$("#campos").hide();
else
$("#campos").show('fast');
});
$("#campos").hide();
$('div.table-selection').click(function() { $('div').removeClass('success').find('input').prop('checked', false); $(this).addClass('success').find('input').prop('checked', true); });
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.3/jquery.min.js"></script>
<div>
<div class="table-selection">
Opção 1
<input type="radio" name="op" value="op1" required aria-required="true" />
</div>
<div class="table-selection">Opção 2
<input type="radio" name="op" value="op2" checked="checked" required aria-required="true" />
</div>
<div class="table-selection">
Opção 3
<input type="radio" name="op" value="op3" required aria-required="true" />
</div>
</div>
<div id="campos">
Exibe instrução
<div>
Obrigado pela atenção pessoal.