title: Bootstrap Carousel TypeError: e[g] is not a function
body: <p>I'm trying to create a <a href="http://www.w3schools.com/bootstrap/bootstrap_carousel.asp" rel="nofollow">bootstrap carousel</a> from my <code>json</code> data, and I use <a href="https://github.com/BorisMoore/jquery-tmpl" rel="nofollow">jQuery-Template</a> to render this carousel, (In other words, I create my carousel slider dynamically from my <code>json</code> data with use <code>jQuery-Template</code>).  Here is my code:</p>
  
  <pre><code>    &lt;div id="main-slide-show" class="slide-show" class="carousel slide" data-ride="carousel"&gt;
          &lt;!-- Indicators --&gt;
          &lt;ol class="carousel-indicators"&gt;
          &lt;/ol&gt;
          &lt;!-- Wrapper for slides --&gt;
          &lt;div class="carousel-inner" role="listbox"&gt;
          &lt;/div&gt;
      &lt;/div&gt;
      &lt;script class="tmpl-gallery-slider" type="text/html"&gt;
          &lt;div class="item"&gt;
              &lt;img src="/content/{{html file.fileName}}" alt="{{html title}}"&gt;
          &lt;/div&gt;
     &lt;/script&gt;
  </code></pre>
  
  <p>and my call-back function (after rendering with <code>jQuery-Template</code>) is like below:</p>
  
  <pre><code>function mainSliderCallback() {
          $(".carousel-inner .item").each(function(i){
              $(".carousel-indicators").append('&lt;li data-target="#main-slide-show" data-slide-to="'+i+'"&gt;&lt;/li&gt;');
          });
          $(".carousel-inner .item").first().addClass("active");
          $(".carousel-indicators li").first().addClass("active");
  
          $('.carousel-indicators li').bind('click', function (e) {
              $('#main-slide-show').carousel($(e.target).attr('data-slide-to'));
          });
      }
  </code></pre>
  
  <p>but when I click on carousel's indicators, I receive this error from bootstrap.min.js:</p>
  
  <blockquote>
    <p>TypeError: e[g] is not a function</p>
  </blockquote>
  
  <p>In other hand, after loading of the page is complete, using this code in Firebug, change carousel to slide 1 with no error:</p>
  
  <pre><code>$('#main-slide-show').carousel(1);
  </code></pre>
  
  <p>now my question is what is wrong in my code/solution?</p>