JSFiddle - React, Tailwind, and code Playground

HTML

<div class="outrasInfo">
    <div class="boxOpcionais">
        <label>Aqui entra a pergunta</label>
        <span class="inputs">
            <input type="radio" name="addImagem1" value="sim" class="sim" /> Sim
            <input type="radio" name="addImagem1" value="nao" class="nao" /> Não
        </span>  
    </div>    
        <div class="boxIntOpc">
            <input type="radio" name="respItem1" /> Item1
            <input type="radio" name="respItem1" /> Item2
            <input type="radio" name="respItem1" /> Item3
        </div> 
</div>

<div class="outrasInfo">
    <div class="boxOpcionais">
        <label>Aqui entra a pergunta</label>
        <span class="inputs">
            <input type="radio" name="addImagem2" value="sim" class="sim" /> Sim
            <input type="radio" name="addImagem2" value="nao" class="nao" /> Não
        </span>  
    </div>    
        <div class="boxIntOpc">
            <input type="radio" name="respItem2" /> Item1
            <input type="radio" name="respItem2" /> Item2
            <input type="radio" name="respItem2" /> Item3
        </div> 
</div>

<div class="outrasInfo">
    <div class="boxOpcionais">
        <label>Aqui entra a pergunta</label>
        <span class="inputs">
            <input type="radio" name="addImagem3" value="sim" class="sim" /> Sim
            <input type="radio" name="addImagem3" value="nao" class="nao"  /> Não
        </span>  
    </div>    
        <div class="boxIntOpc">
            <input type="radio" name="respItem3" /> Item1
            <input type="radio" name="respItem3" /> Item2
            <input type="radio" name="respItem3" /> Item3
        </div> 
</div>

CSS

.outrasInfo{margin-bottom:10px;}
.boxOpcionais {width:400px; height:35px; background:#e2e2e2; clear:both; overflow:hidden; font-family:arial; font-size:11px;}
.boxOpcionais label{float: left; padding:10px 20px;}
.boxOpcionais .inputs{float: right; padding:7px 15px; border-left:3px solid #fff;}
.boxIntOpc{width:360px; height:35px; background:#e2e2e2; clear:both; overflow:hidden; font-family:arial; font-size:11px; padding:10px 20px; margin-top:3px; display:none;}

JavaScript

$('div.outrasInfo').on('click', '.inputs input', function (evt) {
    //var elem = $('.sim').is(':checked');
    var elem = $(this).hasClass('sim');
    if(elem){
        var that = $(this),
        opc = that.parents().children('div.boxIntOpc');
        opc.slideDown(); 
    } else {
        var that = $(this),
        opc = that.parents().children('div.boxIntOpc');
        opc.slideUp();    
    };
    //evt.preventDefault();
})