Cómo descolgar la sección si el botón de radio está marcado en forma

Simplemente quiero saber cómo colapsar una sección div cuando se comprueba un botón de radio como el siguiente

Radiobutton que quiero comprobar para colapsar una sección

@Html.RadioButtonFor(model => model.Transaction.PaymentProvider, "2") @Html.LabelFor(model => model.Transaction.PaymentProvider, "Pay with Credit Card")

Sección que quería colapsar si se marca Radiobutton arriba

 
Card Number:
@Html.EditorFor(model => model.Transaction.CreditCard.CardNumber) @Html.ValidationMessageFor(model => model.Transaction.CreditCard.CardNumber)

Estoy usando bootstrap y probé las clases de acordeón, pero eso solo funciona con un hipervínculo y no estoy seguro de cómo hacer una condición si el botón de radio está marcado y luego decolorar

  

este es el código que se depura de IE

usando información de aquí el evento click de jQuery en el botón de opción no se activa

 $("input[name=Transaction_PaymentProvider]").click(function(){ if($('input:radio[name=Transaction_PaymentProvider]:checked').val() == "2"){ $('.panel-body').show(); }else{ $('.panel-body').hide(); } } 

Tendrá que ver qué nombre se genera para el botón de opción. No recuerdo si el nombre será. o _. http://api.jquery.com/show/ y http://api.jquery.com/hide/ repasa formas en que puedes personalizar el efecto. Espero que esto ayude.