function called repeatedly in javascript
<p>I define a tag picker which will generate checkbox inputs based on "group". If I select the tags I want and press done button, it should return a string to set the value of a text input.</p>

<p>Here are the related codes. The problem is it only works well at the first time. For example, for the first time, if I checked 'jquery','javascript' in the tags,</p>

<pre><code>console.log('output is:' + tags);
</code></pre>

<p>print out 'output is: jquery,javascript'. Works!
Then I use it again and select 'jquery','javascript','bootstrap',
it will return </p>

<pre><code>output is: jquery,javascript,bootstrap
output is: 
</code></pre>

<p>One more time for 'jquery','javascript','bootstrap', it returns</p>

<pre><code>output is: jquery,javascript,bootstrap
output is:
output is:
</code></pre>

<p>Seems the done button pressed, the function is called repeatedly. Being stuck with it for several hours but can't figure out. Really appreciate for your answer! Thanks</p>

<pre><code>(function(){
  $.fn.tagPicker = function(source,options){
    var settings = $.extend({
      perRow : 3
    },options);

    $.fn.attachRow = function(row,col){
      //codes here
      ...
    }

    $.fn.attachPicker = function(){
      //codes here
      // generate html for checkbox inputs
      ...
    };

    var $input = this;

    if($('.tag-picker').length == 0){ 
      $input.attachPicker(); 

      $('body').on('click','.tag-picker .close-picker',function(){
        $('.tag-picker').remove();
      })

      $('.tag-picker .close-picker').off();

      $('body').on('click','.tag-picker #btn-done', function(){
        var tags = getTags();
        $('.tag-picker').remove();
        console.log('output is:' + tags);
        $input.val(tags);       
      });
    }

    function getTags(){
      var t = [];
      $('.tag-picker input').each(function(){
        if($(this).is(':checked')) t.push($(this).attr('id'));
      })
      return t.join(',');
    }
  }
})(jQuery);

$('body').on('click','input.participant',function(){
      $(this).val('');
      $(this).tagPicker(group);           
})
</code></pre>
