title: Mark new tag in select2?
body: <p>I am using select2,</p>
  
  <p>I have set it up so I can add a new tag if it does not exist,</p>
  
  <p>I am also using twitter bootstrap,
  If a tag does not exist I want to mark it as a new tag, to do so I prepend the text with <code>'&lt;span class="label label-important"&gt;New&lt;/span&gt; '</code> this as my select2 initializer.</p>
  
  <pre><code>$('#newVideoCategory').select2({
          placeholder: 'Select a category...',
          data: categories,
          createSearchChoice: function (term, data) {
              if ($(data).filter(function () {
                  return this.text.localeCompare(term) === 0;
              }).length === 0) {
                  return {id: term, text: '&lt;span class="label label-important"&gt;New&lt;/span&gt; ' + term};
              }
          },
          initSelection: function (element, callback) {
              $(categories).each(function () {
                  if (this.id == element.val()) {
                      callback(this);
                      return;
                  }
              })
          }
      })
  </code></pre>
  
  <p>Now this works great</p>
  
  <p><img src="https://i.stack.imgur.com/WkwoC.png" alt="Marked as new tag"></p>
  
  <p>Unless what I have entered for the tag exists as part of the markup for that label
  <img src="https://i.stack.imgur.com/5O3OA.png" alt="Error marked as new tag"></p>
  
  <p>From what I have gathered I need to overwrite either the <code>formatResult</code>, <code>formatSelection</code>, or <code>matcher</code>.</p>
  
  <p>That's what I got from the documentation, but I don't understand how I need to alter it.</p>