JSFiddle - React, Tailwind, and code Playground
by Luis Lebolo
HTML
<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/bootstrap/2.3.2/css/bootstrap.min.css">
<script src="//netdna.bootstrapcdn.com/bootstrap/2.3.2/js/bootstrap.min.js"></script>
<div class="accordion" id="accordion2">
<div class="accordion-group">
<div class="accordion-heading"> <a id="dude" class="accordion-toggle" data-toggle="false" data-parent="#accordion2" href="#collapseOne">
Collapsible Group Item #1
</a>
</div>
<div id="collapseOne" class="accordion-body collapse">
<div class="accordion-inner">...</div>
</div>
</div>
<div class="accordion-group">
<div class="accordion-heading"> <a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion2" href="#collapseTwo">
Collapsible Group Item #2
</a>
</div>
<div id="collapseTwo" class="accordion-body collapse">
<div class="accordion-inner">...</div>
</div>
</div>
<div class="accordion-group">
<div class="accordion-heading"> <a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion2" href="#collapseThree">
Collapsible Group Item #3
</a>
</div>
<div id="collapseThree" class="accordion-body collapse">
<div class="accordion-inner">...</div>
</div>
</div>
</div>
JavaScript
/*$('.accordion-toggle').on('click', function (e) {
e.preventDefault();
e.stopPropagation();
})*/
$("#dude").collapse("toggle");
$.ajax({
type: 'POST',
url: '/echo/html/',
data: {
html:
"<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras semper leo urna, at tincidunt sapien facilisis ac. Etiam gravida dui felis, adipiscing hendrerit diam facilisis in. Mauris aliquam diam lorem, nec faucibus metus lacinia a. Nunc eu sapien vitae lacus venenatis sollicitudin. Aenean vitae varius massa. Nunc congue fringilla aliquet. Suspendisse metus nunc, euismod in velit sit amet, eleifend tristique urna. Proin eget lorem aliquam, accumsan erat sed, laoreet ligula. Nunc nulla erat, dictum ut dignissim eu, accumsan vel eros. Nullam eu mollis dolor, convallis aliquam felis. Fusce libero libero, pellentesque at elit non, porttitor aliquam erat. Vestibulum pulvinar malesuada lectus a luctus. Vivamus malesuada libero nec nunc condimentum, eget dictum ligula hendrerit.Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras semper leo urna, at tincidunt sapien facilisis ac. Etiam gravida dui felis, adipiscing hendrerit diam facilisis in. Mauris aliquam diam lorem, nec faucibus metus lacinia a. Nunc eu sapien vitae lacus venenatis sollicitudin. Aenean vitae varius massa. Nunc congue fringilla aliquet. Suspendisse metus nunc, euismod in velit sit amet, eleifend tristique urna. Proin eget lorem aliquam, accumsan erat sed, laoreet ligula. Nunc nulla erat, dictum ut dignissim eu, accumsan vel eros. Nullam eu mollis dolor, convallis aliquam felis. Fusce libero libero, pellentesque at elit non, porttitor aliquam erat. Vestibulum pulvinar malesuada lectus a luctus. Vivamus malesuada libero nec nunc condimentum, eget dictum ligula hendrerit.Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras semper leo urna, at tincidunt sapien facilisis ac. Etiam gravida dui felis, adipiscing hendrerit diam facilisis in. Mauris aliquam diam...