JSFiddle - React, Tailwind, and code Playground
HTML
<link rel="stylesheet" href="http://www.zrift.com/new/css/bootstrap.min.css">
<div class="container">
<div class="page-header content resume" id="resume">
<h1>Test</h1>
</div>
<div class="row content resume">
<div class="list-group">
<a href="#" class="list-group-item" id="test" data-toggle="modal" data-target="#testModal">
<h4 class="list-group-item-heading">Test Head</h4>
<p class="list-group-item-text">Test Description</p>
</a>
</div>
</div>
<div class="modal fade" id="testModal" tabindex="-1" role="dialog" aria-labelledby="testModalLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">×</span><span class="sr-only">Close</span></button>
<h4 class="modal-title" id="testModalLabel">Test Modal</h4>
</div>
<div class="modal-body"></div>
</div>
</div>
</div>
</div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="http://www.zrift.com/new/js/bootstrap.min.js"></script>
JavaScript
$(document).ready(function() {
var e = $('#testModal').find('.modal-body');
var f = '<a class="comment">Link 1</a>';
e.html(f);
$('.comment').click(function() {
$(this).parent().html('This is your comment.<br /><br /><a class="return">Return</a>');
});
$(e).on('click', '.return', function() {
e = $(this).parent().html(f);
});
});