JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta/js/bootstrap.min.js"></script>



<input id="rbone" type="radio" name="group" class="show" />

<label for="rbone">Show</label>
<br />
<input id="rbtwo" type="radio" name="group" class='hide'/>
<label for="rbtwo">Hide</label>

<div id="thing">
  <p>
    Nothing to see here
  </p>.</div>

JavaScript

//On click of show, fade in 
$( ".show" ).click(function() {
  $('#thing').fadeIn();
});

//On click of hide, fade out
$( ".hide" ).click(function() {
  $('#thing').fadeOut();
});