title: multiple clone not working when append in select 2
body: <p>Can anyone please let me know what is wrong with the following code: 
  <strong>HTML</strong></p>
  
  <pre><code>&lt;div class="form-wrapper"&gt;
           &lt;div class="form-repaet"&gt;
            &lt;div class="form-group"&gt;
              &lt;select id="selecttag" name="book[0].tag" class="form-control select2 input-lg" style="width: 100%;"&gt;
                &lt;option selected="selected"&gt;Tag&lt;/option&gt;
                &lt;option&gt;1&lt;/option&gt;
                &lt;option&gt;2&lt;/option&gt;
              &lt;/select&gt;
            &lt;/div&gt;
            &lt;div class="form-group"&gt;
              &lt;select class="form-control select2" name="book[0].is" style="width: 100%;"&gt;
                &lt;option selected="selected"&gt;is&lt;/option&gt;
                &lt;option&gt;1&lt;/option&gt;
                &lt;option&gt;2&lt;/option&gt;
              &lt;/select&gt;
            &lt;/div&gt;
            &lt;div class="form-group"&gt;
              &lt;select class="form-control select2 test1" name="book[0].select_tag" style="width: 100%;"&gt;
                &lt;option selected="selected"&gt;Select a Tag&lt;/option&gt;
                &lt;option&gt;1&lt;/option&gt;
                &lt;option&gt;2&lt;/option&gt;
              &lt;/select&gt;
            &lt;/div&gt;
  
            &lt;div class="form-group"&gt;
             &lt;div class="btn-group m-r"&gt; 
               &lt;button data-toggle="dropdown" class="btn btn-default dropdown-toggle"&gt; 
                &lt;span class="dropdown-label"&gt;&lt;i class="ion-gear-b"&gt;&lt;/i&gt;&lt;/span&gt; 
               &lt;/button&gt; 
               &lt;ul class="dropdown-menu dropdown-select"&gt; 
                &lt;li class="active"&gt;
                 &lt;a href="#"&gt;All&lt;/a&gt;
                &lt;/li&gt; 
                &lt;li&gt;&lt;a href="#"&gt;Option2&lt;/a&gt;&lt;/li&gt; 
                &lt;li&gt;&lt;a href="#"&gt;Option3&lt;/a&gt;&lt;/li&gt;  
               &lt;/ul&gt; 
              &lt;/div&gt;
            &lt;/div&gt;
            &lt;div class="clearfix"&gt;&lt;/div&gt;
            &lt;div class="line line-dashed line-lg pull-in"&gt;&lt;/div&gt;
         &lt;/div&gt;
  </code></pre>
  
  <p><strong>JavaScript</strong> I am using following codes for javascript</p>
  
  <pre><code>$(document).ready(function(){
      var counter = 1;
      $("#add-form").click(function () {
          if(counter&gt;10){
                  alert("Only 10 textboxes allow");
                  return false;
          }
          $(".form-repaet:last").clone().appendTo(".form-wrapper");
          //$(".form-repaet:last").select2();
          counter++;
      });
  
       $("#removebtn").click(function () {
        if(counter==1){
            return false;
         }
          $(".form-repaet").last().remove();
          counter--;
       });
    });
  </code></pre>
  
  <p>It is creating a clone of 'form-repaet' div but the select box is not working. I've tried <code>select2();</code> after clone, but it is not working. Any help would be appreciated. Thanks so much!</p>