问使用Javascript或Jquery追加Html

EN

var testCaseNames = ['test', 'test2'];

 //Modal
var testCaseNames = ['test', 'test2'];

//Modal
var modal = '<form class="modal multi-step" id="creationModal"><div class="modal-dialog"><div class="modal-content"><div class="modal-header">';
//Progress
modal += '<div class="m-progress"><div class="m-progress-bar-wrapper"><div class="m-progress-bar"></div><div class="m-progress-stats"><span class="m-progress-current"></span>/<span class="m-progress-total"></span></div><div class="m-progress-complete">Completed</div></div>';

$.each(testCaseNames, function(key, value) {
  //Headers
  $('.modal-header').html('<h4 class="modal-title step-' + key + ' data-step="' + key + '"</h4>');
  //Body
  modal += '<div class="modal-body step-' + key + '" data-step="' + key + '">' + value + '</div>';
  // //Footer Buttons
  modal += '<div class="modal-footer"><button type="button" class="btn btn-default" data-dismiss="modal">Close</button></div>';
  modal += '</div></div></form>';
});

$('#modalDiv').empty().html(modal);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<div id="modalDiv">
  <form class="modal multi-step in" id="creationModal" style="display: block; padding-right: 17px;">
    <div class="modal-dialog">
      <div class="modal-content">
        <div class="modal-header">
          <h4 class="modal-title step-0" data-step="0"> </h4></div>
      </div>
    </div>
  </form>
</div>