Backbone.js : Not rendering some view
<p>I have a page that display some paragraphs and a chart, Backbone and Marionette success show the paragraphs, but not with the chart.</p>

<p>I haven't error on my Script, the chart is show only when I <strong>refresh/reload</strong> the browser. Maybe the chart is not rendered or something like that. I don't know what happening here. I use Chartist-js for the chart.</p>

<p>Here is my code</p>

<p><strong>View.js</strong></p>

<pre><code>programming.module("Program.Tutorial", function(Tutorial, programming, Backbone, Marionette, $, _){
    Tutorial.tutorV = Marionette.ItemView.extend({
        template : "#subtutorial",
        tagName : "div",
        className : "tutorial-wrapper"
    })

    Tutorial.tutorCV = Marionette.CompositeView.extend({
        template : "#tutorial",
        tagName : "div",
        childView : Tutorial.tutorV,
        childViewContainer : "div.subtutorial",
        serializeData : function(){
            return {
                model1 : this.model.toJSON(),
                model2 : this.options.model2.toJSON()
            }
        }
    })

    Tutorial.notfound = Marionette.ItemView.extend({
        template : "#notfound",
        tagName : "div"
    })
})
</code></pre>

<p><strong>Controller.js</strong> </p>

<pre><code>programming.module("Program.Tutorial", function(Tutorial, programming, Backbone, Marionette, $, _){
    Tutorial.Controller = {
        getTutorial : function(id){
            //Get Color Scheme From model that have id
            var program = programming.request("program:entities")
            var model2 = program.get(id)

            //Get Tutorial
            var tutorials = programming.request("tutorial:entities",id);
            var frameworks = programming.request("tutorial:framework");
            var modelFramework = frameworks.get(id);


            if(tutorials !== undefined) {

                var TutorialV = new Tutorial.tutorCV({
                    model:tutorials,
                    model2 : modelFramework
                })


                programming.wrapper.show(TutorialV);

                //Restyle the color scheme
                var color = model2.escape("color");
                var p_nama = model2.escape("nama");
                var header_text = "&lt;div id='title'&gt;&lt;i class='material-icons md-24 mrg-10'&gt;code&lt;/i&gt;"+ p_nama +" Programming&lt;/div&gt;";
                $('#header').css({'background':color});
                $('#header').html(header_text);
                $('h2').css({'color':color});
                $('.chapter-title').css({'color':color});
                $('.btn-cta').css({'background-color': color});

            } else {
                var notfound = new Tutorial.notfound()

                programming.wrapper.show(notfound);


                //jQuery function that not working, expect if I reload the page
                var header_text = "&lt;div id='title'&gt;&lt;i class='material-icons md-24 mrg-10'&gt;code&lt;/i&gt;Programming Language&lt;/div&gt;";
                $('#header').css({'background':'#00897B'});
                $('#header').html(header_text);
                $('h2').css({'color':'#00897B'});
            }
        }
    }
})
</code></pre>

<p><strong>Index.html</strong> </p>

<pre><code>&lt;!-- Region --&gt;
&lt;div id="wrapper"&gt;
            &lt;h2&gt;Opppss... Error :(&lt;/h2&gt;
&lt;/div&gt;


        &lt;script type="text/template" id="tutorial"&gt;
            &lt;h2&gt;
            &lt;a href="#listprogram/&lt;%=model1.id%&gt;" class="program"&gt;&lt;i class="material-icons"&gt;arrow_back&lt;/i&gt;&lt;/a&gt;
            &lt;%=model1.title%&gt;&lt;/h2&gt;
            &lt;%=model1.content%&gt;


            &lt;!-- Here is the chart, if i remove the EventListener, .ct-chart is2 undefined, so I add that and its working just need to reload the browser to see the chart --&gt;


            &lt;h2&gt;List of &lt;%=model2.nama%&gt; Framework&lt;/h2&gt;
            &lt;div class="ct-chart2 ct-perfect-fourth" style="width:450px;max-width:100%;margin:0 auto;"&gt;&lt;/div&gt;

            &lt;%
            document.addEventListener('DOMContentLoaded',function(){
            var chart = function(){
                var data = {
                    labels : model2.label,
                    series : [model2.user]
                }

                var option = {
                    showPoint : false,
                    lineSmooth : false,
                    axisX : {
                        showGrid : false
                    }
                }
                new Chartist.Line('.ct-chart2',data,option)
            }

            chart();
            })

            %&gt;
        &lt;/script&gt;
</code></pre>