JSFiddle - React, Tailwind, and code Playground

HTML

<form action="">
    <input type="radio" name="calenders" value="calendar_details_b2b">B2B
    <br>
    <input id="hii" type="radio" name="calenders" value="calendar_details_b2c">B2C
</form>
<div id="calendar_details_b2c" style=>
    content of B2C
</div>
<div id="calendar_details_b2b">
    content of B2B
</div>

CSS

#calendar_details_b2c,
#calendar_details_b2b
{
    display: none;
}

JavaScript

$('input[type=radio][name=calenders]').change(function () {
  $('#calendar_details_b2c').css("display","none");
  $('#calendar_details_b2b').css("display","none");
  console.log($(this).val());
  var fieldToShow = $(this).val();
  $("#" + fieldToShow).css("display","block");
});