Bootstrap 3.1+ - JQuery - Remote Modal Content Manipulation

An example of Bootstrap 3 Remote Modal Content Manipulation with JQuery

HTML

<link rel="stylesheet" href="http://getbootstrap.com/dist/css/bootstrap.css">
<script src="http://getbootstrap.com/dist/js/bootstrap.js"></script>
<script src="https://getfirebug.com/firebug-lite-debug.js"></script>
<a data-toggle="modal" href="/dbasch/B9EZC/show/" data-target="#myModal" data-merchant-name="Bob's House of Pancakes">Click me !</a>

<!-- Modal -->
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                 <h4 class="modal-title">Modal title</h4>

            </div>
            <div class="modal-body">
                <div class="te"></div>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
            </div>
            <!-- /.modal-content -->
        </div>
        <!-- /.modal-dialog -->
    </div>
    <!-- /.modal -->

JavaScript

// we can't use the show.bs.modal or loaded.bs.modal events
// because the remote modal elements are not accessible in the DOM
// when those events trigger

// when the remote modal content is loaded  
// $('#myModal').on('shown.bs.loaded', function (e) {

    // get a data attribute value from the clicked element
    // var merchantName = $(e.relatedTarget).data('merchant-name');

    // and set the content of the shown remote modal
    // $('#myModalLabel').text("shown.bs.loaded event triggered");
//
// });

// when the remote modal content is loaded  
$('#myModal').on('shown.bs.loaded', function (e,f) {

alert(1);
console.log(e);
console.log(f);
    // get a data attribute value from the clicked element
    var merchantName = $(e.relatedTarget).data('merchant-name');

    // and set the content of the shown remote modal
    $('#myModalLabel').text("shown.bs.loaded event triggered");

});

// cleanup the content of the hidden remote modal because it is cached
$('#reservationModal').on('hide.bs.modal', function (e) {

    $(this).removeData('bs.modal');

});