Tenho um select com dois option, quando eu seleciono o primeiro option quero que ele me mostre um campo input com o atributo required e quando eu selecionar o segundo option eu quero que ele faça o mesmo, só que retirando o required do primeiro input.
A função que eu criei adiciona o required no input mostrado, só que quando eu faço ele mostrar o segundo input, ele mantém o required nos dois campos.
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<html>
<head lang="pt-br">
<meta charset="utf-8">
<script type="text/javascript" src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("#campos > input").hide();
$("#formulario").change(function(){
$("#campos > input").hide();
$( '#'+$( this ).val() ).show('fast').attr('required', 'required');;
});
});
</script>
</head>
<body>
<select name="formulario" id="formulario">
<option value="">--</option>
<option value="empresa">Empresa</option>
<option value="cantidato">Cantidato</option>
</select>
<div id="campos">
<input type="text" value="" placeholder="CNPJ" id="empresa">
<input type="text" value="" placeholder="CPF" id="cantidato">
</div>
</body>
</html>
Gostaria que o required fosse mantido apenas no input selecionado.
Grato.