{% if anchor_id != 'toggle-correlation-description' %}
    <div class="col-sm-12 text-right">
        <button class="btn btn-default btn-sm"
                data-toggle="collapse"
                data-target="#bottom-{{ anchor_id }}, #minifreqtable{{ anchor_id }}"
                aria-expanded="true"
                aria-controls="collapseExample">
            {{ text }}
        </button>
    </div>
{% else %}
    <button id="{{ anchor_id }}"
            class="btn btn-default btn-sm"
            style="float: right"
            data-toggle="collapse">
        {{ text }}
    </button>
    <script>
    var waitForJQuery = setInterval(function () {
        if (typeof $ != 'undefined') {
            $(function() {
                $('#toggle-correlation-description').click(function () {
                    $('.correlation-description').toggle();
                    $('.tab-pane[id^=correlations_tab-]').each(function (e) {
                        var v = $(this).find('.correlation-diagram').length;
                        if (v == 1) {
                            $('.correlation-diagram').toggleClass('col-sm-6').toggleClass('col-sm-12');
                        }
                        else if (v == 2){
                            $('.correlation-diagram').toggleClass('col-sm-4').toggleClass('col-sm-6');
                        }
                        else if (v == 3){
                            $('.correlation-diagram').toggleClass('col-sm-3').toggleClass('col-sm-4');
                        }
                        else{
                            console.log("unsupported number of reports");
                        }
                    });
                }).click();
            });
            clearInterval(waitForJQuery);
        }
    }, 10);
    </script>
{% endif %}
