title: How to close Bootstrap collaps after AJAX success
body: <p>I am using a Bootstrap collapse control in my webpage. Whenever I click on the link it used to open and close. I am using AJAX to send data to a PHP page and on success print the result. After the AJAX call <code>data-toggle</code> should close. Please see my code below.</p>
  
  <pre><code>&lt;a data-toggle="collapse" href="#review" class="open-code btn btn-default"&gt;Write a Review&lt;/a&gt;
  &lt;div id="review" class="collapse code"&gt;
      &lt;form id="review"&gt;
        my code...
       &lt;/from&gt;
  &lt;/div&gt;
  </code></pre>
  
  <pre class="lang-js prettyprint-override"><code>$(function() {
      $(document).on('submit', '#review_post', function(e) {
          //var $this = $(this);
          var message = $(this).find("#message").val();
          var rating = $(this).find("#input-2c").val();
          var vendor_id = $(this).find("#vendor_id").val();
          var infostring = 'message=' + message + '&amp;rating=' + rating + '&amp;vendor_id=' + vendor_id;
  
          if(message=='') {
              alert('Please add your Message');
          } else {
              $.ajax({
                  type: "POST",
                  url: "/review_vendor.php",
                  data: infostring,
                  success: function(data){
                      //alert(data);
                      $('#review_post').each(function() {
                          this.reset();
                      }); 
                      // here I want to use the code to close data-toggle
  
                      $("#flash").append(data);
                  }
              });
          }
          e.preventDefault();  
      }); 
  });
  </code></pre>
  
  <p>I tried this code but it's not working:</p>
  
  <pre><code>$(this).find('.collapse').trigger('click');
  </code></pre>