JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta/css/bootstrap.min.css">
<div class="btn-group btn-group-sm mb-2" id="container__Direction" role="group" data-toggle="buttons">

  <label class="btn btn-group-btn active">
    <input type="radio" name="hello" data-toggle="button" id="input__Direction_Return" checked /> &lt;--&gt; Return
  </label>
  <label class="btn btn-group-btn">
    <input type="radio" name="hello"  data-toggle="button" id="input__Direction_OneWay" /> --&gt; One way
  </label>
  <label class="btn btn-group-btn">
    <input type="radio" name="hello"  data-toggle="button" id="input__Direction_MultiStop" /> -&gt;-&gt; Multi Stop
  </label>

</div>

<hr />

<div id="container__Inbound_Date">
  <label for="input__Date">Date:</label><br/>
  <input type="date" id="input__Date" />
</div>

JavaScript

$(function () {

  $('#input__Direction_Return').on('click', function () {
      if ($(this).is(':checked')) {
          $("#container__Inbound_Date").show();
      }        
  });

  $('#input__Direction_OneWay').on('click', function () {
      if ($(this).is(':checked')) {
          $("#container__Inbound_Date").hide();
      }
  });

  $('#input__Direction_MultiStop').on('click', function () {
      if ($(this).is(':checked')) {
          $("#container__Inbound_Date").show();
      }
  });

$('input[name='hello']').change(function() {
if ($(this).attr('id') == 'input__Direction_OneWay') {
    $("#container__Inbound_Date").hide();
   }
});
});