From 7d0701399d065bc6d47d8d4dae55e47e617bb31a Mon Sep 17 00:00:00 2001
From: alexweissman <alex@alexanderweissman.com>
Date: Sun, 3 Sep 2017 00:47:09 -0400
Subject: [PATCH] Fix tagging examples

---
 pages/08.tagging/docs.md | 32 +++++++++++++++++++++++++++++---
 1 file changed, 29 insertions(+), 3 deletions(-)

diff --git a/pages/08.tagging/docs.md b/pages/08.tagging/docs.md
index f918f734..f75003e1 100644
--- a/pages/08.tagging/docs.md
+++ b/pages/08.tagging/docs.md
@@ -20,9 +20,15 @@ In addition to a prepopulated menu of options, Select2 can also allow free-text
 </div>
 
 ```
+<select class="form-control">
+  <option selected="selected">orange</option>
+  <option>white</option>
+  <option>purple</option>
+</select>
+
 $(".js-example-tags").select2({
   tags: true
-})
+});
 ```
 
 Note that when tagging is enabled the user can select from the pre-existing options or create a new option by picking the first choice, which is what the user has typed into the search box so far.
@@ -41,6 +47,22 @@ Tagging can also be used in multi-value select boxes. In the example below, we s
   </p>
 </div>
 
+```
+<select class="form-control" multiple="multiple">
+  <option selected="selected">orange</option>
+  <option>white</option>
+  <option selected="selected">purple</option>
+</select>
+```
+
+<script type="text/javascript">
+
+$(".js-example-tags").select2({
+  tags: true
+});
+
+</script>
+
 Try entering a value that isn't listed in the dropdown - you'll be able to add it as a new option!
 
 ## Automatic tokenization into tags
@@ -63,12 +85,16 @@ options.
 </p>
 </div>
 
-```
+<pre data-fill-from=".js-code-example-tokenizer"></pre>
+
+<script type="text/javascript" class="js-code-example-tokenizer">
+
 $(".js-example-tokenizer").select2({
     tags: true,
     tokenSeparators: [',', ' ']
 })
-```
+
+</script>
 
 ## Customizing tag creation