I have found many questions here about getting iframe's height and set it via Javascript or jQuery however in my case none have worked. I've installed MailChimp Plugin on a wordpress website to load the newsletters within tabs based on years and months.

I'm using ajax to call and return the value of iframe thus the iframe is dynamic and the content as well. So I tried all possible ways to load the correct and accurate height of the parsed link however it's not getting the accurate result.

Below is my code:

jQuery(function() {

    jQuery('label.tab-label').click(function() {

        // this.id retrieves the id attribute/property value
        // of the 'this' element (here the clicked <a> element:
        var id      = jQuery(this).data("id");
        var input   = jQuery('input[name="tab"]');
        input.attr('id', 'tab' + id);

        // Reset iFrame Load
        // if (jQuery('.wp-embedded-content').size()){
        //     jQuery('iframe').remove();
        // }

        var wpajax_url = document.location.protocol + '//' + document.location.host + '/wp-admin/admin-ajax.php?action=get_content';

        jQuery.ajax({
                cache: false,
                timeout: 0,
                url: wpajax_url,
                data: {post_id: id},
                dataType: "json",
                type: 'POST',
                success: function(data) {
                    jQuery("div.tab-content").html( data );
                    jQuery('iframe').attr('allowfullscreen', 'allowfullscreen'); 
                    jQuery("div.tab-content").find("iframe").removeAttr("height");
                    jQuery('iframe').attr('id','newsletter-frame');

                    function getHeight()
                    {
                        var body = document.body;
                        var html = document.documentElement; 
                        var bodyH = Math.max( body.clientHeight, body.scrollHeight, body.offsetHeight, html.clientHeight, html.scrollHeight, html.offsetHeight );
                        return bodyH;
                    }

                    var height =  jQuery('iframe').innerText = getHeight();
                    console.log('Height is', height);
                    jQuery("div.tab-content").find("iframe").attr("height", height);

                },
                error: function(data) {
                    jQuery("#tab-content").html( 'something went wrong' );
                }
        });

        return false;
    });
});   

Did anyone experienced that before and have the correct solution to return dynamically the iframe height with 100% accuracy.

Note also neither CSS has resolved the issue nor the height attribute.