如何在jQuery中重新加载div

Question

I have a div in which I have used submit button as follow :

<div id="collapse2" class="panel-collapse collapse">
        <div class="panel-body">
        <div class="logininput">
        <?php do_action( 'woocommerce_checkout_billing' ); ?>
        <button id="sendmail3" class="btn btn-info">Submit</button>
        </div>
        </div>
      </div>

in this when I click on button sendmail3 then a jquery is triggered as follow :

jQuery("#sendmail3").click(function(){
            var country = jQuery("#billing_country").val();
            var address = jQuery("#billing_address_1").val();
            var city = jQuery("#billing_city").val();
            var state = jQuery("#billing_state").val();
            //alert(state);
            var pincode = jQuery("#billing_postcode").val();

            var SecondData = "country="+country+"&address="+address+"&city="+city+"&state="+state+"&pincode="+pincode;
            var currenturl = jQuery(location).attr('href');
            var url = currenturl;
            jQuery.ajax({
                dataType : 'html',
                type: 'GET',
                url : url,
                data : SecondData,
                complete : function() { },
                success: function(data) 
                    {
                        jQuery("#collapse2").hide();
                        jQuery("#collapse3").show();
                    }
            });
          });

I have one more div collapse3 as follow :

<div id="collapse3" class="panel-collapse collapse">
        <div class="panel-body">
            <form name="checkout" method="post" class="checkout woocommerce-checkout" action="<?php echo esc_url( $get_checkout_url ); ?>" enctype="multipart/form-data">
            <div id="hideform">
            <?php do_action( 'woocommerce_checkout_billing' ); ?>
            </div>
            <h3 id="order_review_heading"><?php _e( 'Your order', 'woocommerce' ); ?></h3>

                <?php do_action( 'woocommerce_checkout_before_order_review' ); ?>

                <div id="order_review" class="woocommerce-checkout-review-order">
                    <?php do_action( 'woocommerce_checkout_order_review' ); ?>
                </div>

                <?php do_action( 'woocommerce_checkout_after_order_review' ); ?></div>
                </form>
                <?php do_action( 'woocommerce_after_checkout_form', $checkout ); ?>
      </div>

In this div data is loaded dynamically

What I want is that when I click on sendmail3 button then only the div collapse3 should be reloaded. How can I reload this div only without refreshing the page

Answer 1

I think this will work.

    success: function(data) 
                {
                    jQuery("#collapse2").hide();
                    jQuery("#collapse3").append(data); //I change this to .append() or try .html(data);


                }

Hope this works.