[Solved]-How to create multiple highchart and print in HTML page by using for loop?-Highcharts

One of the reasons it is not working is that you had not added the code in an anonymous function. Other was that you had added document.ready code in for loop of non document.ready codes. This makes the code skip the execution until document is ready.

<script type='text/javascript'>
    $(document).ready(function () {
        function createElem() {
            for(v=1;v<{{ uniindicatorproduct|safe }}+1;v++) {
                var container = "#container"+v;
                var title = { text: '{{ title|safe }}' };
                var xAxis = {categories: {{ t|safe }}, };
                var yAxis = {title: {text: ' '}, };
                var array ={{ y|safe }}
                var series = [],
                    i = 0;
                var a = {{ x|safe }}
                    lena = a.length
                for (i; i < lena; i++) {
                    series.push({
                        name: [a[i]],
                        data: array[i]
                    });
                }
                var json = {};
                .....
                $(container).highcharts(json);
            }
        }

        //Call the above function once html is ready
        createElem();
    });
</script>