I would like a tip on checked, select option as I do to clear the fields if a person selects an option

Question

Good morning I would like a tip on checked, select option as I do to clear the fields if a person selects an option

<form method="post">
                    <input type="hidden" name="id" value="<!--# Valor=Cliente.Id #-->" />

                    <div class="row">
                        <div class="small-12 columns">
                            <label class="required">Tipo de cliente</label>

                            <input type="radio" id="rjuridica" class="switchVal" data-show="juridica" data-hide="fisica" name="atipo" value="juridica" <!--# Fazer=Cliente.ChecarTipo.Juridica #-->> 
                            <label for="rjuridica">Pessoa jurídica</label>

                            <input type="radio" id="rfisica" class="switchVal" data-show="fisica" data-hide="juridica" name="atipo" value="fisica" <!--# Fazer=Cliente.ChecarTipo.Fisica #-->>
                            <label for="rfisica">Pessoa física</label>
                        </div>
                    </div>

would like when person clicked on legal person to clear the field of imput Cpf with old information as physical person clear the cnpj of the field

                                <div class="small-3 columns">
                                <label class="required">CPF</label>
                                <input class="cpf" type="text" name="acpf" value="<!--# Valor=Cliente.Cpf #-->"/>
                            </div>



                            <div class="small-3 columns">
                            <label class="required">CNPJ</label>
                            <input class="cnpj" type="text" name="acnpj" value="<!--# Valor=Cliente.CNPJ #-->"/>
                        </div>

by jquerry or php

Answer 1

Utilize onclick, so when you click, it will delete the input content.

https://jsfiddle.net/a0g21L1c/

$("#rjuridica").click(function(){
    $(".cpf").val(" ");
});

With this function, when you press the radio, it will clear the input.

Answer 2

I believe that this cleaning involves validation, and only clearing the field will not prevent the submission of it, the ideal would be something like this...

$(document).ready(function(){
                        var cpf = '';
                        var cnpj = '';
                        $('input[type="radio"]').change(function(){
                          if($(this).val() == 'juridica'){
                    	if($('.cpf').val() != cpf){cpf = $('.cpf').val();}
                          	$('.cpf').val('');
                          	$('.cpf').attr('disabled', 'true');
                            $('.cnpj').removeAttr('disabled');
                            $('.cnpj').val(cnpj);
                          }else{
                          if($('.cnpj').val() != cnpj){cnpj = $('.cnpj').val();}
                          	$('.cnpj').val('');
                            $('.cnpj').attr('disabled', 'true');
                            $('.cpf').removeAttr('disabled');
                            $('.cpf').val(cpf);
                          }
                        })
                        })

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="hidden" name="id" value="<!--# Valor=Cliente.Id #-->" />

                    <div class="row">
                        <div class="small-12 columns">
                            <label class="required">Tipo de cliente</label>

                            <input type="radio" id="rjuridica" class="switchVal" data-show="juridica" data-hide="fisica" name="atipo" value="juridica">
                            <label for="rjuridica">Pessoa jurídica</label>

                            <input type="radio" id="rfisica" class="switchVal" data-show="fisica" data-hide="juridica" name="atipo" value="fisica">
                            <label for="rfisica">Pessoa física</label>
                        </div>
                    </div>
                    
                    <div class="small-3 columns">
                                <label class="required">CPF</label>
                                <input class="cpf" type="text" name="acpf" value=""/>
                            </div>



                            <div class="small-3 columns">
                            <label class="required">CNPJ</label>
                            <input class="cnpj" type="text" name="acnpj" value=""/>
                        </div>