Skip to main content

generar textbox según segun seleccion de Radiobutton

Mi situación es que necesito generar un textbox según la selección de un radiobutton, y que dependiendo de la selección de el RedioButton las propiedades del textbox puede variar o tener el mismo nombre, etc. El código que tengo es este, de antemano gracias por la ayuda:

    $(function(){
        $(".op").click(function(){
        if($(this).val()=='1')
        {
    
        var monto_inp = document.createElement("input");
        monto_inp.id = "idInput";
        monto_inp.name = "monto";
        monto_inp.placeholder = "cedula";
        monto_inp.type = "text";
        monto_inp.classList.add('detalle_pago');
        monto_inp.classList.add('monto');
        document.body.appendChild(monto_inp);
        monto_inp.onkeyup = function() {console.log("onkeyup en input");}
            
        }
        else if($(this).val()=='2')
        {
   
        var monto_inp = document.createElement("input");
        monto_inp.id = "idInput";
        monto_inp.name = "monto";
        monto_inp.placeholder = "Passport";
        monto_inp.type = "text";
        monto_inp.classList.add('detalle_pago');
        monto_inp.classList.add('monto');
        document.body.appendChild(monto_inp);
        monto_inp.onkeyup = function() {console.log("onkeyup en input");}
            
        }
    
        })})
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<label>Documento</label>
    
     <div class="radio-inline">
    
     <label class="checkbox-inline"><input type="radio" class="op" name="documento" value="1" > Cédula</label>
     <label class="checkbox-inline"><input type="radio" class="op" name="documento" value="2" > Pasaporte</label> <br>
     
    </div>   <br>
    
     <label >Documento de Identidad</label>