Javascript 显示/隐藏选定单选按钮的选择选项

我有两个单选按钮和一个选项选择下拉菜单，需要由用户选择

用户必须为每个选项选择标题、徽标和选项

我在页面加载时隐藏了选择选项，然后为用户选择的单选按钮显示，而其他选项保持隐藏状态。我的问题是，如果用户单击“标题”单选按钮，但随后决定更改为另一个“标题”，则可以正常工作，但当从“标题”按钮单击“徽标”单选按钮时，它会隐藏切换到的“标题”的选择选项

例如：我希望用户单击“标题”单选按钮，然后显示一个选择选项。然后，如果用户决定单击另一个“标题”按钮，选择选项将移动到新选择的“标题”。如果用户随后单击“徽标”按钮，则会显示所选“徽标”按钮的选择选项，而不会隐藏先前所选“标题”的选择选项

如果这让人困惑，我很抱歉，但我正试图以最好的方式解释

谢谢

Javascript:

<script type="text/javascript">

$().ready(function(){

$('.test').hide();

$('input.myClass').prettyCheckable();
$(".prettyradio").on("click",function(){

var relatedSelect2 = $(this).parent('.parent').find('.test');

$('.test').hide();
relatedSelect2.show();

});


});

</script>

$（）.ready（函数（））{
$（'.test'）.hide（）；
$（'input.myClass'）.prettyCheckable（）；
$（“.prettyradio”）。在（“单击”，函数（）{
var relatedSelect2=$（this.parent（'.parent'）.find（'.test'）；
$（'.test'）.hide（）；
relatedSelect2.show（）；
});
});

PHP:

echo”
";
回声“；
对于（$i=0；$i请在小提琴中的代码中尝试以下内容：

$(".header, .logo").on("click",function(){

var relatedSelect2 = $(this).parent('.parent').children('.test');
$('.test').hide();
    $('.parent').each(function(index){
          $(this).children('input:checked').parent('.parent').children('.test').show();
    });
relatedSelect2.show();

});

如果选中了标题收音机，这不会隐藏选择，即使在另一行中选中了徽标收音机。
为什么不创建一个代码的JSFIDLE演示。这会更好地提供帮助。dude check站点然后将代码添加到其简单易用的内部。这是一个不工作的JSFIDLE：谢谢，它工作得很好！我有upd用PrettyCheckable.js编辑我的jsfiddle，这似乎仍然给我带来了一个问题。
$(".header, .logo").on("click",function(){

var relatedSelect2 = $(this).parent('.parent').children('.test');
$('.test').hide();
    $('.parent').each(function(index){
          $(this).children('input:checked').parent('.parent').children('.test').show();
    });
relatedSelect2.show();

});