JSFiddle - React, Tailwind, and code Playground

by kevintsengtw

HTML

<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.0.0-rc1/css/bootstrap.min.css">
<script src="http://code.jquery.com/jquery.js"></script>
<script src="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.3.2/js/bootstrap.min.js"></script>
<table class="table table-bordered table-striped">
        <tr>
            <td>
              <button type="button" class="btn">
                Click to expand
              </button>
            </td>
        </tr>
        <tr id="collapseme" class="collapse out"><td><div>Should be collapsed</div></td></tr>
    </table>

JavaScript

$(".btn").click(function() {
    if($("#collapseme").hasClass("out")) {
        $("#collapseme").addClass("in");
        $("#collapseme").removeClass("out");
    } else {
        $("#collapseme").addClass("out");
        $("#collapseme").removeClass("in");
    }
});