title: jQuery: Post data from ajax response
body: <p>I'm posting a form via ajax which has the class "bookroom_ajax", the ajax result is returned in a separately div with the class "ajax_response", this is working fine.</p>
  
  <p>But I want to return the results inside the same form it is submited from, but if I add the ajax response class to the form it doesn't work any more: </p>
  
  <pre><code>&lt;form class="bookroom_ajax ajax_response"&gt;
  </code></pre>
  
  <p>Here's the jQuery ajax code:</p>
  
  <pre><code>jQuery(document).ready(function($) {
  
  $(document).on("click",'#bookingbutton2', function() {
  
      $('.ajax_response').html('&lt;img src="http://mailgun.github.io/validator-demo/loading.gif" alt="Loading..."&gt;');
  
      $.ajax({
          type: 'POST',
          url: AJAX_URL,
          data: $('.bookroom_ajax').serialize(),
          dataType: 'json',
          success: function(response) {
  
              if (response.status == 'success') {
                  $('.bookroom_ajax')[0].reset();
              }
  
              $('.ajax_response').html(response.content);
  
  
          }
      });
  
  });
  
  });
  </code></pre>