Bootstrap Modal with placeholder ready to populate with event details

<div id="fullCalModal" class="modal fade" tabindex="-1" role="dialog">
    <div class="modal-dialog modal-lg">
      <div class="modal-content">
        <div class="modal-header">
          <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
          <h4 class="modal-title"></h4>
        </div>
        <div class="modal-body">
          <div class="row">
            <div class="col-md-6">
              <img data-id="event-artwork" class="img-responsive" alt="Tour poster">
            </div>
            <div class="col-md-6">
              <h2 data-id="artist"></h2>
              <h3 data-id="tour"></h3>
              <p><span class="glyphicon glyphicon-map-marker" aria-hidden="true"></span> <span data-id="event-venue1"></span>
              <span data-id="event-venue2"></span></p>
              <p><span class="glyphicon glyphicon-calendar" aria-hidden="true"></span> <span data-id="event-start-date"></span> <span class="glyphicon glyphicon-time" aria-hidden="true"></span> <span data-id="event-start-time"></span></p>
              <p data-id="event-description"></p>
              <p data-id="ticket-availability"></p>
            </div>
          </div>
        </div>
        <div class="modal-footer">
          <a role="button" class="btn btn-default" data-dismiss="modal">Close</a>
          <a data-id="buy-tickets" role="button" class="btn btn-primary">Buy Tickets</a>
        </div>
      </div><!-- /.modal-content -->
    </div><!-- /.modal-dialog -->
  </div><!-- /.modal -->