title: How to show Ajax response as modal popup
body: <p>I have a link on clicking it is sending <code>ajax</code> request and getting response successfully which is html file and I am appending to a <code>div</code>, but I need to show that <code>div</code> as <code>modal popup</code> and I tried something below.</p>
  
  <p>in <code>html</code> file</p>
  
  <pre><code>&lt;a th:if="${ratingSummary}" href="#"  class="small dark account review_ratings_login"&gt;Login to write a review&lt;/a&gt; 
  
  &lt;div id="login_for_review" data-toggle="modal" data-target="#reviewLoginModal"&gt;&lt;/div&gt;
  </code></pre>
  
  <p>in <code>js</code> file</p>
  
  <pre><code>$(document).on('click', '.review_ratings_login', function () {
          var $data = $('#review_product_id span').text();
           var url = '/mycompany/login/'+$data;
          $.ajax({
              type: 'GET',
              url: url,
              success: function (output) {
              $('#login_for_review').html(output).modal('show');// I tried to show this response as modal popup
              },
              error: function(output){
              alert("fail");
              }
          });
      });
  </code></pre>
  
  <p><code>output</code> file</p>
  
  <pre><code>&lt;div  class="centerForm modal fade" role="dialog" style="margin-left: 35%;" id="reviewLoginModal"&gt;
  
        &lt;div class="modal-dialog modal-sm" &gt;
         &lt;div class="modal-content"&gt;
            // here I have login form
      &lt;/div&gt;
    &lt;/div&gt;
  </code></pre>
  
  <p>but I am not getting this <code>html output</code> as <code>modal pup</code> instead I am getting <code>black screen</code> can anyone help me how to do this?</p>