JSFiddle - React, Tailwind, and code Playground

by oilvier

HTML

<fieldset>
  <legend>Type de la recherche</legend>
  <label for="seek[mot]"><input type="radio" name="seek" value="mot" data-id="mot" id="seek[mot]" /> <span>mot</span></label>
  <label for="seek[text]"><input type="radio" name="seek" value="text" data-id="text" id="seek[text]" /> <span>date</span></label>
</fieldset>
<div id="mot" class="test no-display">
	<label for="prenom">Prénom:</label><input type="text" id="prenom" /><br />
	<label for="age">Nom:</label><select id="age"><option>21</option></select><br />
</div>

<div id="text" class="test no-display">
	toto
</div>

CSS

.no-display {display: none;}

JavaScript

$('input[name="seek"]').on('change', function() {
	var id = $(this).attr('data-id');
  $('.test').addClass('no-display');
  $('#' + id).removeClass('no-display');
});