JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap.min.css">
<script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.1/js/bootstrap.min.js"></script>
<a href="#credits" class="toggle btn btn-primary">Click on me to reveal the hidden treasure</a>

<div id="credits" class="well hidden">
     <h1>I'm the hidden treasure :)</h1>

    <p><a href="#yesdiv" class="toggle btn btn-default">Click for Yes</a> / <a href="#nodiv" class="toggle btn btn-warning">Click for No</a></p>
    <div id="yesdiv">
    Ans is Yes
    </div>
    <div id="nodiv" visible="hide">
    Answer is NO
    </div>
</div>

CSS

/*
Demo Only
*/
 body {
    padding: 5%;
}
#credits {
    margin-top: 5%;
}

JavaScript

$(function () {

  document.getElementById('yesdiv').hidden = true;
  		$("nodiv").hide();
    $('.toggle').click(function (event) {
        event.preventDefault();
        var target = $(this).attr('href');
        $(target).toggleClass('hidden show');
    });

});