jQuery .html() breaks Summernote

http://stackoverflow.com/questions/36823644/jquery-html-breaks-summernote/36823871#36823871

by Charles Cavalcante

HTML

<script src="https://code.jquery.com/jquery-1.11.3.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/summernote/0.8.1/summernote.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.1/css/font-awesome.min.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/summernote/0.8.1/summernote.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
<div class="row home-options">
  <div class="modal fade" id="homeOptionModal" tabindex="-1" role="dialog" aria-labelledby="homeOptionModalLabel">
    <div class="modal-dialog" role="document">
      <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" id="homeOptionModalLabel"></h4>
        </div>
        <div class="modal-body">

        </div>
        <div class="modal-footer">
          <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
          <button type="button" class="btn btn-primary">Save changes</button>
        </div>
      </div>
    </div>
  </div>
  <a href="#" class="col-xs-12 col-sm-6">
    <div class="option-square">
      <h1>Click me</h1>
      <div class="option-content">
        <div class="form-group">
          <input type="text" placeholder="Full Name" class="form-control" id="fullname" value="" />
        </div>
        <div class="form-group">
          <input type="text" placeholder="What's your current job?" class="form-control" id="job" value="" />
        </div>
        <div class="form-group">
          <input type="text" placeholder="What city are you in?" class="form-control" id="location" value="" />

        </div>
        <div class="form-group">
          <textarea...

CSS

.modal-dialog {
  margin: 80px auto;
}

.modal-content {
  border: 5px solid #2A9CFF;
  border-radius: 0px;
}

.option-content {
  display: none;
}

JavaScript

$(".home-options a").click(function() {
	  var _modal = $('#homeOptionModal');
	  var _this = $(this);
	  var _header = _this.find("h1").text();
	  var _tcontent = _this.find(".option-content").html();
	  _modal.modal('show');
	  _modal.find(".modal-title").html(_header);
	  _modal.find(".modal-body").html(_tcontent);

	  $('.summernote', _modal).summernote({
	    toolbar: [
	      // [groupName, [list of button]]
	      ['style', ['bold', 'italic', 'underline', 'clear']],
	      ['font', ['strikethrough', 'superscript', 'subscript']],
	      ['para', ['ul', 'ol', ]]
	    ]
	  });
	});