From fb458d23812e815872e7d978b3361b1894fd5c32 Mon Sep 17 00:00:00 2001
From: Eric Dahl <eric.c.dahl@gmail.com>
Date: Sun, 26 Jan 2014 13:23:05 -0600
Subject: [PATCH 1/4] Documentation: Replace duplicated id="lifecycle" with
 id="drag_drop" for the Drag and Drop Sorting example

---
 index.html          | 2 +-
 select-2.1.html     | 2 +-
 select2-latest.html | 2 +-
 3 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/index.html b/index.html
index c7f75ef2..bd48c6a5 100644
--- a/index.html
+++ b/index.html
@@ -822,7 +822,7 @@ $("#e14_destroy").click(function() { $("#e14").select2("destroy"); });
           </div>
       </article>
 
-      <article class="row" id="lifecycle">
+      <article class="row" id="drag_drop">
 <script id="script_e15">
 $(document).ready(function () {
 $("#e15").select2({tags:["red", "green", "blue", "orange", "white", "black", "purple", "cyan", "teal"]});
diff --git a/select-2.1.html b/select-2.1.html
index f292f20d..e264f8b8 100755
--- a/select-2.1.html
+++ b/select-2.1.html
@@ -571,7 +571,7 @@ version: 2.1
     </div>
 </article>
 
-<article class="row" id="lifecycle">
+<article class="row" id="drag_drop">
     <script id="script_e15">
         $(document).ready(function () {
             $("#e15").select2({tags:["red", "green", "blue", "orange", "white", "black", "purple", "cyan", "teal"]});
diff --git a/select2-latest.html b/select2-latest.html
index 6c1cab05..f569f211 100644
--- a/select2-latest.html
+++ b/select2-latest.html
@@ -829,7 +829,7 @@ $("#e14_destroy").click(function() { $("#e14").select2("destroy"); });
           </div>
       </article>
 
-      <article class="row" id="lifecycle">
+      <article class="row" id="drag_drop">
 <script id="script_e15">
 $(document).ready(function () {
 $("#e15").select2({tags:["red", "green", "blue", "orange", "white", "black", "purple", "cyan", "teal"]});

From 44d1eab55f1442b0120aa98d5fcbf91762541125 Mon Sep 17 00:00:00 2001
From: Eric Dahl <eric.c.dahl@gmail.com>
Date: Sun, 26 Jan 2014 13:31:44 -0600
Subject: [PATCH 2/4] Documentation: Add missing semicolons in examples, and
 remove an extraneous one

---
 index.html          | 6 +++---
 select-2.1.html     | 4 ++--
 select2-latest.html | 6 +++---
 3 files changed, 8 insertions(+), 8 deletions(-)

diff --git a/index.html b/index.html
index bd48c6a5..f0b83988 100644
--- a/index.html
+++ b/index.html
@@ -76,7 +76,7 @@ $("#e5").select2({
         else if (movie.synopsis !== undefined) {
             markup += "<div class='movie-synopsis'>" + movie.synopsis + "</div>";
         }
-        markup += "</td></tr></table>"
+        markup += "</td></tr></table>";
         return markup;
     }
 
@@ -174,7 +174,7 @@ $("#e10").select2({
 });
 
 var data=[{id:0,tag:'enhancement'},{id:1,tag:'bug'},{id:2,tag:'duplicate'},{id:3,tag:'invalid'},{id:4,tag:'wontfix'}];
-function format(item) { return item.tag; };
+function format(item) { return item.tag; }
 
 $("#e10_2").select2({
     data:{ results: data, text: 'tag' },
@@ -250,7 +250,7 @@ $("#e10_4").select2({
                                     var markup=template
                                             .replace(/\$url/g, this.html_url)
                                             .replace(/\$num/g, this.number)
-                                            .replace(/\$title/g, this.title.replace("<", "&lt;"))
+                                            .replace(/\$title/g, this.title.replace("<", "&lt;"));
                                     list.append(markup);
                                 });
 
diff --git a/select-2.1.html b/select-2.1.html
index e264f8b8..8016b4a4 100755
--- a/select-2.1.html
+++ b/select-2.1.html
@@ -66,7 +66,7 @@ version: 2.1
         else if (movie.synopsis !== undefined) {
             markup += "<div class='movie-synopsis'>" + movie.synopsis + "</div>";
         }
-        markup += "</td></tr></table>"
+        markup += "</td></tr></table>";
         return markup;
     }
 
@@ -146,7 +146,7 @@ version: 2.1
         });
 
         var data=[{id:0,tag:'enhancement'},{id:1,tag:'bug'},{id:2,tag:'duplicate'},{id:3,tag:'invalid'},{id:4,tag:'wontfix'}];
-        function format(item) { return item.tag; };
+        function format(item) { return item.tag; }
 
         $("#e10_2").select2({
             data:{ results: data, text: 'tag' },
diff --git a/select2-latest.html b/select2-latest.html
index f569f211..54ff23bf 100644
--- a/select2-latest.html
+++ b/select2-latest.html
@@ -76,7 +76,7 @@ $("#e5").select2({
         else if (movie.synopsis !== undefined) {
             markup += "<div class='movie-synopsis'>" + movie.synopsis + "</div>";
         }
-        markup += "</td></tr></table>"
+        markup += "</td></tr></table>";
         return markup;
     }
 
@@ -174,7 +174,7 @@ $("#e10").select2({
 });
 
 var data=[{id:0,tag:'enhancement'},{id:1,tag:'bug'},{id:2,tag:'duplicate'},{id:3,tag:'invalid'},{id:4,tag:'wontfix'}];
-function format(item) { return item.tag; };
+function format(item) { return item.tag; }
 
 $("#e10_2").select2({
     data:{ results: data, text: 'tag' },
@@ -263,7 +263,7 @@ $("#e10_4").select2({
                                     var markup=template
                                             .replace(/\$url/g, this.html_url)
                                             .replace(/\$num/g, this.number)
-                                            .replace(/\$title/g, this.title.replace("<", "&lt;"))
+                                            .replace(/\$title/g, this.title.replace("<", "&lt;"));
                                     list.append(markup);
                                 });
 

From 61973c4e52f8466405106d4f67a48b625f6e3a5d Mon Sep 17 00:00:00 2001
From: Eric Dahl <eric.c.dahl@gmail.com>
Date: Sun, 26 Jan 2014 13:43:21 -0600
Subject: [PATCH 3/4] Documentation: Fix typos

---
 index.html          | 14 +++++++-------
 select-2.1.html     |  8 ++++----
 select2-1.0.html    |  6 +++---
 select2-latest.html | 12 ++++++------
 4 files changed, 20 insertions(+), 20 deletions(-)

diff --git a/index.html b/index.html
index f0b83988..2d4c59df 100644
--- a/index.html
+++ b/index.html
@@ -390,7 +390,7 @@ $("#e10_4").select2({
       <article class="row" id="multi">
         <div class="span4">
           <h3>Multi-Value Select Boxes</h3>
-           <p>Select2 also supports multi-value select boxes. The <code>select</code> below is declared with the <code>multiple</code> attribute. Select2 automatially picks up on this:</p>
+           <p>Select2 also supports multi-value select boxes. The <code>select</code> below is declared with the <code>multiple</code> attribute. Select2 automatically picks up on this:</p>
            <p>
                <select multiple name="e9" id="e9" style="width:300px" class="populate"></select>
            </p>
@@ -462,7 +462,7 @@ $("#e2_2").select2({
             <h3>Example Code</h3>
             <pre class="prettyprint linenums" id="code_e4"></pre>
             <p>
-                You can set <code>data-</code> attributes to <code>&lt;option&gt;</code> (or &lt;optgroup&gt;) and use them inside temptlating functions:
+                You can set <code>data-</code> attributes to <code>&lt;option&gt;</code> (or &lt;optgroup&gt;) and use them inside templating functions:
             </p>
             <pre class="prettyprint linenums">
 &lt;select&gt;
@@ -665,7 +665,7 @@ $("#e11")
     .on("select2-selecting", function(e) { log ("selecting val="+ e.val+" choice="+ JSON.stringify(e.choice));})
     .on("select2-removing", function(e) { log ("removing val="+ e.val+" choice="+ JSON.stringify(e.choice));})
     .on("select2-removed", function(e) { log ("removed val="+ e.val+" choice="+ JSON.stringify(e.choice));})
-    .on("select2-loaded", function(e) { log ("loaded (data property omitted for brevitiy)");})
+    .on("select2-loaded", function(e) { log ("loaded (data property omitted for brevity)");})
     .on("select2-focus", function(e) { log ("focus");})
     .on("select2-blur", function(e) { log ("blur");});
 $("#e11_2")
@@ -677,7 +677,7 @@ $("#e11_2")
     .on("select2-selecting", function(e) { log ("selecting val="+ e.val+" choice="+ JSON.stringify(e.choice));})
     .on("select2-removing", function(e) { log ("removing val="+ e.val+" choice="+ JSON.stringify(e.choice));})
     .on("select2-removed", function(e) { log ("removed val="+ e.val+" choice="+ JSON.stringify(e.choice));})
-    .on("select2-loaded", function(e) { log ("loaded (data property omitted for brevitiy)");})
+    .on("select2-loaded", function(e) { log ("loaded (data property omitted for brevity)");})
     .on("select2-focus", function(e) { log ("focus");})
     .on("select2-blur", function(e) { log ("blur");});
 });
@@ -1107,7 +1107,7 @@ $(document).ready(function () {
                     <dt>element</dt><dd>Uses javascript to calculate the width of the source element.</dd>
                     <dt>copy</dt><dd>Copies the value of the width style attribute set on the source element.</dd>
                     <dt>resolve</dt><dd>First attempts to <u>copy</u> than falls back on <u>element</u>.</dd>
-                    <dt>other values</dt><dd>if the width attribute contains a function it will be avaluated, otherwise the value is used verbatim.</dd>
+                    <dt>other values</dt><dd>if the width attribute contains a function it will be evaluated, otherwise the value is used verbatim.</dd>
                 </dl>
             </td></tr>
             <tr><td>minimumInputLength</td><td>int</td><td>Number of characters necessary to start a search.</td></tr>
@@ -1416,7 +1416,7 @@ $("#select").select2({
 
                 The default tokenizer will only be used if the <code>tokenSeparators</code> and <code>createSearchChoice</code>
                 options are specified. The default tokenizer will split the string using any separator in <code>tokenSeparators</code>
-                and will create and select choice objects using <code>createSearhChoice</code> option. It will also
+                and will create and select choice objects using <code>createSearchChoice</code> option. It will also
                 ignore duplicates, silently swallowing those tokens.
             </td></tr>
             <tr id="doc-tokenSeparators"><td>tokenSeparators</td><td>array</td><td>
@@ -1790,7 +1790,7 @@ $("#select").select2({
         <div class="row zebra">
             <div class="span12">
                 <h3>select2-focus</h3>
-                <p>Fired when the control is focussed.
+                <p>Fired when the control is focused.
                 </p>
             </div>
         </div>
diff --git a/select-2.1.html b/select-2.1.html
index 8016b4a4..5523560e 100755
--- a/select-2.1.html
+++ b/select-2.1.html
@@ -270,7 +270,7 @@ version: 2.1
 <article class="zebra row" id="multi">
     <div class="span4">
         <h3>Multi-Value Select Boxes</h3>
-        <p>Select2 also supports multi-value select boxes. The <code>select</code> below is declared with the <code>multiple</code> attribute. Select2 automatially picks up on this:</p>
+        <p>Select2 also supports multi-value select boxes. The <code>select</code> below is declared with the <code>multiple</code> attribute. Select2 automatically picks up on this:</p>
         <p>
             <select multiple name="e9" id="e9" style="width:300px"><option value="AL">Alabama</option><option value="AK">Alaska</option><option value="AZ">Arizona</option><option value="AR">Arkansas</option><option value="CA">California</option><option value="CO">Colorado</option><option value="CT">Connecticut</option><option value="DE">Delaware</option><option value="FL">Florida</option><option value="GA">Georgia</option><option value="HI">Hawaii</option><option value="ID">Idaho</option><option value="IL">Illinois</option><option value="IN">Indiana</option><option value="IA">Iowa</option><option value="KS">Kansas</option><option value="KY">Kentucky</option><option value="LA">Louisiana</option><option value="ME">Maine</option><option value="MD">Maryland</option><option value="MA">Massachusetts</option><option value="MI">Michigan</option><option value="MN">Minnesota</option><option value="MS">Mississippi</option><option value="MO">Missouri</option><option value="MT">Montana</option><option value="NE">Nebraska</option><option value="NV">Nevada</option><option value="NH">New Hampshire</option><option value="NJ">New Jersey</option><option value="NM">New Mexico</option><option value="NY">New York</option><option value="NC">North Carolina</option><option value="ND">North Dakota</option><option value="OH">Ohio</option><option value="OK">Oklahoma</option><option value="OR">Oregon</option><option value="PA">Pennsylvania</option><option value="RI">Rhode Island</option><option value="SC">South Carolina</option><option value="SD">South Dakota</option><option value="TN">Tennessee</option><option value="TX">Texas</option><option value="UT">Utah</option><option value="VT">Vermont</option><option value="VA">Virginia</option><option value="WA">Washington</option><option value="WV">West Virginia</option><option value="WI">Wisconsin</option><option value="WY">Wyoming</option></select><br/>
         </p>
@@ -762,7 +762,7 @@ version: 2.1
         <tr><td>text</td><td>string</td><td>text of the option being matched</td></tr>
         <tr><td>&lt;returns&gt;</td><td>boolean</td><td><code>true</code> if search term matches the option text, or <code>false</code> otherwise</td></tr>
     </table>
-    The default implementation is case insensitive and matches anywhere in ther term:
+    The default implementation is case insensitive and matches anywhere in the term:
     <code>function(term, text) { return text.toUpperCase().indexOf(term.toUpperCase())>0; }</code>
 </td></tr>
 <tr><td>formatSelection</td><td>function</td><td>
@@ -892,7 +892,7 @@ $("#tags").select2({
                 <tr><td>term</td><td>string</td><td>Search term</td></tr>
                 <tr><td>page</td><td>int</td><td>1-based page number tracked by Select2 for use with infinite scrolling of results</td></tr>
                 <tr><td>context</td><td>object</td><td>See <a href="#doc-query-options-callback"><code>options.context</code></a> parameter to the <a href="#doc-query"><code>query</code></a> function above.</td></tr>
-                <tr><td>&lt;returns&gt;</td><td>object</td><td>Object containing url paramters</td></tr>
+                <tr><td>&lt;returns&gt;</td><td>object</td><td>Object containing url parameters</td></tr>
             </table>
         </td></tr>
         <tr><td>results</td><td>function</td><td>
@@ -953,7 +953,7 @@ $("#tags").select2({
 
     </td></tr>
 </table>
-Example: <pre class="prettyprint">alert("Selected value is: "+$("#e8").select2("val")); $("#e8").select2("val", {id:"CA", text:"Califoria"});</pre>
+Example: <pre class="prettyprint">alert("Selected value is: "+$("#e8").select2("val")); $("#e8").select2("val", {id:"CA", text:"California"});</pre>
 
 <div class="row">
     <div class="span12"><h3>destroy</h3></div>
diff --git a/select2-1.0.html b/select2-1.0.html
index b9a72ef4..091e0046 100755
--- a/select2-1.0.html
+++ b/select2-1.0.html
@@ -415,7 +415,7 @@ $("#e8_set").click(
                             <tr><th>Parameter</th><th>Type</th><th>Description</th></tr>
                             <tr><td>term</td><td>string</td><td>Search term</td></tr>
                             <tr><td>vars</td><td>object</td><td>The vars object from the previous search's result</td></tr>
-                            <tr><td>&lt;returns&gt;</td><td>object</td><td>Object containing url paramters</td></tr>
+                            <tr><td>&lt;returns&gt;</td><td>object</td><td>Object containing url parameters</td></tr>
                         </table>
                     </td></tr>
                     <tr><td>results</td><td>function</td><td>
@@ -442,7 +442,7 @@ $("#e8_set").click(
           </tr>
           <tr><td>value (optional)</td><td>object</td><td>Result object for the new selection, or the <code>id</code> attribute of a loaded result object</td></tr>
       </table>
-      Example: <pre class="prettyprint">alert("Selected value is: "+$("#e8").select2("val")); $("#e8").select2("val", {id:"CA", text:"Califoria"});</pre>
+      Example: <pre class="prettyprint">alert("Selected value is: "+$("#e8").select2("val")); $("#e8").select2("val", {id:"CA", text:"California"});</pre>
 
       <div class="row">
           <div class="span12"><h2>Events</h2></div>
@@ -459,7 +459,7 @@ $("#e8_set").click(
       <div class="row">
           <div class="span12"><h3>cancelled</h3></div>
       </div>
-      <p>Signalled when the user cancells the selection of a result. For example, when ESC is pressed after the dropdown has been opened</p>
+      <p>Signalled when the user cancels the selection of a result. For example, when ESC is pressed after the dropdown has been opened</p>
       <div class="row">
           <div class="span12"><h3>selected</h3></div>
       </div>
diff --git a/select2-latest.html b/select2-latest.html
index 54ff23bf..2ef7223b 100644
--- a/select2-latest.html
+++ b/select2-latest.html
@@ -403,7 +403,7 @@ $("#e10_4").select2({
       <article class="row" id="multi">
         <div class="span4">
           <h3>Multi-Value Select Boxes</h3>
-           <p>Select2 also supports multi-value select boxes. The <code>select</code> below is declared with the <code>multiple</code> attribute. Select2 automatially picks up on this:</p>
+           <p>Select2 also supports multi-value select boxes. The <code>select</code> below is declared with the <code>multiple</code> attribute. Select2 automatically picks up on this:</p>
            <p>
                <select multiple name="e9" id="e9" style="width:300px" class="populate"></select>
            </p>
@@ -475,7 +475,7 @@ $("#e2_2").select2({
             <h3>Example Code</h3>
             <pre class="prettyprint linenums" id="code_e4"></pre>
             <p>
-                You can set <code>data-</code> attributes to <code>&lt;option&gt;</code> (or &lt;optgroup&gt;) and use them inside temptlating functions:
+                You can set <code>data-</code> attributes to <code>&lt;option&gt;</code> (or &lt;optgroup&gt;) and use them inside templating functions:
             </p>
             <pre class="prettyprint linenums">
 &lt;select&gt;
@@ -672,7 +672,7 @@ $("#e11")
     .on("select2-selecting", function(e) { log ("selecting val="+ e.val+" choice="+ JSON.stringify(e.choice));})
     .on("select2-removing", function(e) { log ("removing val="+ e.val+" choice="+ JSON.stringify(e.choice));})
     .on("select2-removed", function(e) { log ("removed val="+ e.val+" choice="+ JSON.stringify(e.choice));})
-    .on("select2-loaded", function(e) { log ("loaded (data property omitted for brevitiy)");})
+    .on("select2-loaded", function(e) { log ("loaded (data property omitted for brevity)");})
     .on("select2-focus", function(e) { log ("focus");})
     .on("select2-blur", function(e) { log ("blur");});
 $("#e11_2")
@@ -684,7 +684,7 @@ $("#e11_2")
     .on("select2-selecting", function(e) { log ("selecting val="+ e.val+" choice="+ JSON.stringify(e.choice));})
     .on("select2-removing", function(e) { log ("removing val="+ e.val+" choice="+ JSON.stringify(e.choice));})
     .on("select2-removed", function(e) { log ("removed val="+ e.val+" choice="+ JSON.stringify(e.choice));})
-    .on("select2-loaded", function(e) { log ("loaded (data property omitted for brevitiy)");})
+    .on("select2-loaded", function(e) { log ("loaded (data property omitted for brevity)");})
     .on("select2-focus", function(e) { log ("focus");})
     .on("select2-blur", function(e) { log ("blur");});
 });
@@ -1142,7 +1142,7 @@ $(document).ready(function () {
                     <dt>element</dt><dd>Uses javascript to calculate the width of the source element.</dd>
                     <dt>copy</dt><dd>Copies the value of the width style attribute set on the source element.</dd>
                     <dt>resolve</dt><dd>First attempts to <u>copy</u> than falls back on <u>element</u>.</dd>
-                    <dt>other values</dt><dd>if the width attribute contains a function it will be avaluated, otherwise the value is used verbatim.</dd>
+                    <dt>other values</dt><dd>if the width attribute contains a function it will be evaluated, otherwise the value is used verbatim.</dd>
                 </dl>
             </td></tr>
             <tr><td>minimumInputLength</td><td>int</td><td>Number of characters necessary to start a search.</td></tr>
@@ -1471,7 +1471,7 @@ $("#select").select2({
 
                 The default tokenizer will only be used if the <code>tokenSeparators</code> and <code>createSearchChoice</code>
                 options are specified. The default tokenizer will split the string using any separator in <code>tokenSeparators</code>
-                and will create and select choice objects using <code>createSearhChoice</code> option. It will also
+                and will create and select choice objects using <code>createSearchChoice</code> option. It will also
                 ignore duplicates, silently swallowing those tokens.
             </td></tr>
             <tr id="doc-tokenSeparators"><td>tokenSeparators</td><td>array</td><td>

From 11cd18bd93b90ea05a1490f4f66892676a5d9a72 Mon Sep 17 00:00:00 2001
From: Eric Dahl <eric.c.dahl@gmail.com>
Date: Sun, 26 Jan 2014 13:55:16 -0600
Subject: [PATCH 4/4] Documentation: Remove extraneous non-matching close tags:
 </code> and </p>

---
 index.html          | 30 ++++++++----------------------
 select-2.1.html     |  8 ++++----
 select2-latest.html | 30 ++++++++----------------------
 3 files changed, 20 insertions(+), 48 deletions(-)

diff --git a/index.html b/index.html
index 2d4c59df..6d27a73d 100644
--- a/index.html
+++ b/index.html
@@ -487,7 +487,7 @@ function format(state) {
              <p>
                  <input type="hidden" id="e5" style="width:300px"/>
              </p>
-             <p>In order to take advantage of custom data loading Select2 should be attached to an <code>input type='hidden'</code> tag, otherwise data is parsed from <code>select</code>'s <code>option</code> tags.</code></p>
+             <p>In order to take advantage of custom data loading Select2 should be attached to an <code>input type='hidden'</code> tag, otherwise data is parsed from <code>select</code>'s <code>option</code> tags.</p>
           </div>
           <div class="span8">
             <h3>Example Code</h3>
@@ -761,7 +761,7 @@ $("#e11_2")
               by separating them with a comma or a space. Try typing in the search field below and entering a space or a comma.</p>
 
               <p><input type="hidden" id="e20" style="width:300px" value="brown"/></p>
-              <p>Note that the separators are defined in the <a href="#doc-tokenSeparators">tokenSeparators</a> option.</code></p>
+              <p>Note that the separators are defined in the <a href="#doc-tokenSeparators">tokenSeparators</a> option.</p>
               <p>Note that this example uses the built in <a href="#doc-tokenizer">tokenizer</a> function, but a custom one can be provided in the options.</p>
           </div>
           <div class="span8">
@@ -1230,7 +1230,7 @@ $(document).ready(function () {
                     <tr><td>text</td><td>string</td><td>text of the option being matched.</td></tr>
                     <tr><td>option</td><td>jquery object</td>
                         <td>the <code>option</code> element we are trying to match. Only given when attached to <code>select</code>.
-                            Can be used to match against custom attributes on the <code>option</code> tag in addition to matching on the <code>option</code>'s text.</code></td></tr>
+                            Can be used to match against custom attributes on the <code>option</code> tag in addition to matching on the <code>option</code>'s text.</td></tr>
                     <tr><td>&lt;returns&gt;</td><td>boolean</td><td><code>true</code> if search term matches the text, or <code>false</code> otherwise.</td></tr>
                 </table>
                 The default implementation is case insensitive and matches anywhere in the term:
@@ -1411,7 +1411,7 @@ $("#select").select2({
                     <tr><td>&lt;returns&gt;</td><td>string (optional)</td><td>Returns the string to which the input of
                         the search field should be set to. Usually this is the remainder, of any, of the string after
                         the tokens have been stripped. If <code>undefined</code> or <code>null</code> is returned the
-                        input of the search field is unchanged.</code></td></tr>
+                        input of the search field is unchanged.</td></tr>
                 </table>
 
                 The default tokenizer will only be used if the <code>tokenSeparators</code> and <code>createSearchChoice</code>
@@ -1441,9 +1441,9 @@ $("#select").select2({
                             <td>Callback function that should be called with the <code>result</code> object. The result object:
                                 <table class="table table-bordered table-striped">
                                     <tr><th>Parameter</th><th>Type</th><th>Description</th></tr>
-                                    <tr><td>result.results</td><td>[object]</td><td>Array of result objects. The default renderers expect objects with <code>id</code> and <code>text</code> keys</code>. The <code>id</code> attribute is required</code>, even if custom renderers are used. The object may also contain a <code>children</code>key if hierarchical data is displayed. The object may also contain a <code>disabled</code> boolean property indicating whether this result can be selected.</td></tr>
+                                    <tr><td>result.results</td><td>[object]</td><td>Array of result objects. The default renderers expect objects with <code>id</code> and <code>text</code> keys. The <code>id</code> attribute is required, even if custom renderers are used. The object may also contain a <code>children</code>key if hierarchical data is displayed. The object may also contain a <code>disabled</code> boolean property indicating whether this result can be selected.</td></tr>
                                     <tr><td>result.more</td><td>boolean</td><td><code>true</code>if more results are available for the current search term.</td></tr>
-                                    <tr><td>results.context</td><td>object</td><td>A user-defined object that should be made available as the <code>context</code> parameter to the <code>query</code> function on subsequent queries to load more result pages for the same search term. See the description of <a href="#doc-query-options-context">options.context</code></a> parameter.</td></tr>
+                                    <tr><td>results.context</td><td>object</td><td>A user-defined object that should be made available as the <code>context</code> parameter to the <code>query</code> function on subsequent queries to load more result pages for the same search term. See the description of <a href="#doc-query-options-context"><code>options.context</code></a> parameter.</td></tr>
                                 </table>
                             </td></tr>
                     </table>
@@ -1602,7 +1602,7 @@ $("#select").select2({
       <div class="row">
           <div class="span12"><h3>val</h3></div>
       </div>
-      <p>Gets or sets the selection. If the <code>value</code> parameter is not specified, the <code>id</code> attribute of the currently selected element is returned. If the <code>value</code> parameter is specified it will become the current selection.</code></p>
+      <p>Gets or sets the selection. If the <code>value</code> parameter is not specified, the <code>id</code> attribute of the currently selected element is returned. If the <code>value</code> parameter is specified it will become the current selection.</p>
       <table class="table table-bordered table-striped">
           <tr>
               <th>Parameter</th><th>Type</th><th>Description</th>
@@ -1626,7 +1626,7 @@ $("#select").select2({
 
               </table>
           </td></tr>
-          <tr><td>triggerChange (optional)</td><td>boolean</td><td>Whether or not a <code>change</code> event should be triggered. <code>false</code> by default.</code></td></tr>
+          <tr><td>triggerChange (optional)</td><td>boolean</td><td>Whether or not a <code>change</code> event should be triggered. <code>false</code> by default.</td></tr>
       </table>
         <p><code>val</code> method invoked on a single-select with an unset value will return <code>""</code>, while a <code>val</code> method invoked on an empty multi-select will return <code>[]</code>.</p>
 
@@ -1694,7 +1694,6 @@ $("#select").select2({
               <dt>added</dt><dd>The added element, if any - the full element object, not just the id.</dd>
               <dt>removed</dt><dd>The removed element, if any - the full element object, not just the id.</dd>
                 </dl>
-              </p>
           </div>
       </div>
         <div class="row zebra">
@@ -1702,27 +1701,23 @@ $("#select").select2({
                 <h3>select2-opening</h3>
                 <p>Fired before the dropdown is shown.</p>
                 <p>The event listener can prevent the opening by calling <code>preventDefault()</code> on the supplied event object.</p>
-                </p>
             </div>
         </div>
         <div class="row">
             <div class="span12">
                 <h3>select2-open</h3>
                 <p>Fired after the dropdown is shown.</p>
-                </p>
             </div>
         </div>
         <div class="row zebra">
             <div class="span12">
                 <h3>select2-highlight</h3>
                 <p>Fired when a choice is highlighted in the dropdown.</p>
-                </p>
                 <p>The event object contains the following custom properties:
                 <dl>
                     <dt>val</dt><dd>The id of the highlighted choice object.</dd>
                     <dt>object</dt><dd>The highlighted choice object.</dd>
                 </dl>
-                </p>
             </div>
         </div>
         <div class="row">
@@ -1730,13 +1725,11 @@ $("#select").select2({
                 <h3>select2-selecting</h3>
                 <p>Fired when a choice is being selected in the dropdown, but before any modification has been made to the selection.
                     This event is used to allow the user to reject selection by calling <code>event.preventDefault()</code></p>
-                </p>
                 <p>The event object contains the following custom properties:
                 <dl>
                     <dt>val</dt><dd>The id of the highlighted choice object.</dd>
                     <dt>object</dt><dd>The choice object about to be selected.</dd>
                 </dl>
-                </p>
             </div>
         </div>
         <div class="row">
@@ -1744,7 +1737,6 @@ $("#select").select2({
                 <h3>select2-clearing</h3>
                 <p>Fired when a choice is being cleared in the dropdown, but before any modification has been made to the selection.
                     This event is used to allow the user to reject the clear by calling <code>event.preventDefault()</code></p>
-                </p>
                 <p>For the clear button to be visible the <code>allowClear</code> option needs to be <code>true</code>.</p>
             </div>
         </div>
@@ -1753,38 +1745,32 @@ $("#select").select2({
                 <h3>select2-removing</h3>
                 <p>Fired when a choice is about to be removed in the dropdown/input, but before any removal of the choice has been made.
                     This event is used to allow the user to reject removal by calling <code>event.preventDefault()</code></p>
-                </p>
                 <p>The event object contains the following custom properties:
                 <dl>
                     <dt>val</dt><dd>The id of the removing choice object.</dd>
                     <dt>object</dt><dd>The choice object about to be removed.</dd>
                 </dl>
-                </p>
             </div>
         </div>
         <div class="row zebra">
             <div class="span12">
                 <h3>select2-removed</h3>
                 <p>Fired when a choice is removed or cleared.</p>
-                </p>
                 <p>The event object contains the following custom properties:
                 <dl>
                     <dt>val</dt><dd>The id of the highlighted choice object.</dd>
                     <dt>object</dt><dd>The highlighted choice object.</dd>
                 </dl>
-                </p>
             </div>
         </div>
         <div class="row">
             <div class="span12">
                 <h3>select2-loaded</h3>
                 <p>Fired when query function is done loading the data and the results list has been updated</p>
-                </p>
                 <p>The event object contains the following custom properties:
                 <dl>
                     <dt>items</dt><dd>data that was used to populate the results.</dd>
                 </dl>
-                </p>
             </div>
         </div>
         <div class="row zebra">
diff --git a/select-2.1.html b/select-2.1.html
index 5523560e..432b9aa2 100755
--- a/select-2.1.html
+++ b/select-2.1.html
@@ -351,7 +351,7 @@ version: 2.1
         <p>
             <input type="hidden" id="e5" style="width:300px"/>
         </p>
-        <p>In order to take advantage of custom data loading Select2 should be attached to an <code>input type='hidden'</code> tag, otherwise data is parsed from <code>select</code>'s <code>option</code> tags.</code></p>
+        <p>In order to take advantage of custom data loading Select2 should be attached to an <code>input type='hidden'</code> tag, otherwise data is parsed from <code>select</code>'s <code>option</code> tags.</p>
     </div>
     <div class="span8">
         <h3>Example Code</h3>
@@ -865,9 +865,9 @@ $("#tags").select2({
                 <td>Callback function that should be called with the <code>result</code> object. The result object:
                     <table class="table table-bordered table-striped">
                         <tr><th>Parameter</th><th>Type</th><th>Description</th></tr>
-                        <tr><td>result.results</td><td>[object]</td><td>Array of result objects. The default renderers expect objects with <code>id</code> and <code>text</code> keys</code>. The <code>id</code> attribute is required</code>, even if custom renderers are used.</td></tr>
+                        <tr><td>result.results</td><td>[object]</td><td>Array of result objects. The default renderers expect objects with <code>id</code> and <code>text</code> keys. The <code>id</code> attribute is required, even if custom renderers are used.</td></tr>
                         <tr><td>result.more</td><td>boolean</td><td><code>true</code>if more results are available for the current search term</td></tr>
-                        <tr><td>results.context</td><td>object</td><td>A user-defined object that should be made available as the <code>context</code> parameter to the <code>query</code> function on subsequent queries to load more result pages for the same search term. See the description of <a href="#doc-query-options-context">options.context</code></a> parameter.</td></tr>
+                        <tr><td>results.context</td><td>object</td><td>A user-defined object that should be made available as the <code>context</code> parameter to the <code>query</code> function on subsequent queries to load more result pages for the same search term. See the description of <a href="#doc-query-options-context"><code>options.context</code></a> parameter.</td></tr>
                     </table>
                 </td></tr>
         </table>
@@ -926,7 +926,7 @@ $("#tags").select2({
 <div class="row">
     <div class="span12"><h3>val</h3></div>
 </div>
-<p>Gets or sets the selection. If the <code>value</code> parameter is not specified, the <code>id</code> attribute of the currently selected element is returned. If the <code>value</code> parameter is specified it will become the current selection.</code></p>
+<p>Gets or sets the selection. If the <code>value</code> parameter is not specified, the <code>id</code> attribute of the currently selected element is returned. If the <code>value</code> parameter is specified it will become the current selection.</p>
 <table class="table table-bordered table-striped">
     <tr>
         <th>Parameter</th><th>Type</th><th>Description</th>
diff --git a/select2-latest.html b/select2-latest.html
index 2ef7223b..8ca9608f 100644
--- a/select2-latest.html
+++ b/select2-latest.html
@@ -500,7 +500,7 @@ function format(state) {
              <p>
                  <input type="hidden" id="e5" style="width:300px"/>
              </p>
-             <p>In order to take advantage of custom data loading Select2 should be attached to an <code>input type='hidden'</code> tag, otherwise data is parsed from <code>select</code>'s <code>option</code> tags.</code></p>
+             <p>In order to take advantage of custom data loading Select2 should be attached to an <code>input type='hidden'</code> tag, otherwise data is parsed from <code>select</code>'s <code>option</code> tags.</p>
           </div>
           <div class="span8">
             <h3>Example Code</h3>
@@ -768,7 +768,7 @@ $("#e11_2")
               by separating them with a comma or a space. Try typing in the search field below and entering a space or a comma.</p>
 
               <p><input type="hidden" id="e20" style="width:300px" value="brown"/></p>
-              <p>Note that the separators are defined in the <a href="#doc-tokenSeparators">tokenSeparators</a> option.</code></p>
+              <p>Note that the separators are defined in the <a href="#doc-tokenSeparators">tokenSeparators</a> option.</p>
               <p>Note that this example uses the built in <a href="#doc-tokenizer">tokenizer</a> function, but a custom one can be provided in the options.</p>
           </div>
           <div class="span8">
@@ -1265,7 +1265,7 @@ $(document).ready(function () {
                     <tr><td>text</td><td>string</td><td>text of the option being matched.</td></tr>
                     <tr><td>option</td><td>jquery object</td>
                         <td>the <code>option</code> element we are trying to match. Only given when attached to <code>select</code>.
-                            Can be used to match against custom attributes on the <code>option</code> tag in addition to matching on the <code>option</code>'s text.</code></td></tr>
+                            Can be used to match against custom attributes on the <code>option</code> tag in addition to matching on the <code>option</code>'s text.</td></tr>
                     <tr><td>&lt;returns&gt;</td><td>boolean</td><td><code>true</code> if search term matches the text, or <code>false</code> otherwise.</td></tr>
                 </table>
                 The default implementation is case insensitive and matches anywhere in the term:
@@ -1466,7 +1466,7 @@ $("#select").select2({
                     <tr><td>&lt;returns&gt;</td><td>string (optional)</td><td>Returns the string to which the input of
                         the search field should be set to. Usually this is the remainder, of any, of the string after
                         the tokens have been stripped. If <code>undefined</code> or <code>null</code> is returned the
-                        input of the search field is unchanged.</code></td></tr>
+                        input of the search field is unchanged.</td></tr>
                 </table>
 
                 The default tokenizer will only be used if the <code>tokenSeparators</code> and <code>createSearchChoice</code>
@@ -1496,9 +1496,9 @@ $("#select").select2({
                             <td>Callback function that should be called with the <code>result</code> object. The result object:
                                 <table class="table table-bordered table-striped">
                                     <tr><th>Parameter</th><th>Type</th><th>Description</th></tr>
-                                    <tr><td>result.results</td><td>[object]</td><td>Array of result objects. The default renderers expect objects with <code>id</code> and <code>text</code> keys</code>. The <code>id</code> property is required</code>, even if custom renderers are used. The object may also contain a <code>children</code> key if hierarchical data is displayed. The object may also contain a <code>disabled</code> boolean property indicating whether this result can be selected.</td></tr>
+                                    <tr><td>result.results</td><td>[object]</td><td>Array of result objects. The default renderers expect objects with <code>id</code> and <code>text</code> keys. The <code>id</code> property is required, even if custom renderers are used. The object may also contain a <code>children</code> key if hierarchical data is displayed. The object may also contain a <code>disabled</code> boolean property indicating whether this result can be selected.</td></tr>
                                     <tr><td>result.more</td><td>boolean</td><td><code>true</code>if more results are available for the current search term.</td></tr>
-                                    <tr><td>results.context</td><td>object</td><td>A user-defined object that should be made available as the <code>context</code> parameter to the <code>query</code> function on subsequent queries to load more result pages for the same search term. See the description of <a href="#doc-query-options-context">options.context</code></a> parameter.</td></tr>
+                                    <tr><td>results.context</td><td>object</td><td>A user-defined object that should be made available as the <code>context</code> parameter to the <code>query</code> function on subsequent queries to load more result pages for the same search term. See the description of <a href="#doc-query-options-context"><code>options.context</code></a> parameter.</td></tr>
                                 </table>
                             </td></tr>
                     </table>
@@ -1689,7 +1689,7 @@ $("#e1").select2({
       <div class="row">
           <div class="span12"><h3>val</h3></div>
       </div>
-      <p>Gets or sets the selection. If the <code>value</code> parameter is not specified, the <code>id</code> attribute of the currently selected element is returned. If the <code>value</code> parameter is specified it will become the current selection.</code></p>
+      <p>Gets or sets the selection. If the <code>value</code> parameter is not specified, the <code>id</code> attribute of the currently selected element is returned. If the <code>value</code> parameter is specified it will become the current selection.</p>
       <table class="table table-bordered table-striped">
           <tr>
               <th>Parameter</th><th>Type</th><th>Description</th>
@@ -1713,7 +1713,7 @@ $("#e1").select2({
 
               </table>
           </td></tr>
-          <tr><td>triggerChange (optional)</td><td>boolean</td><td>Whether or not a <code>change</code> event should be triggered. <code>false</code> by default.</code></td></tr>
+          <tr><td>triggerChange (optional)</td><td>boolean</td><td>Whether or not a <code>change</code> event should be triggered. <code>false</code> by default.</td></tr>
       </table>
         <p><code>val</code> method invoked on a single-select with an unset value will return <code>""</code>, while a <code>val</code> method invoked on an empty multi-select will return <code>[]</code>.</p>
 
@@ -1781,7 +1781,6 @@ $("#e1").select2({
               <dt>added</dt><dd>The added element, if any - the full element object, not just the id.</dd>
               <dt>removed</dt><dd>The removed element, if any - the full element object, not just the id.</dd>
                 </dl>
-              </p>
           </div>
       </div>
         <div class="row zebra">
@@ -1789,27 +1788,23 @@ $("#e1").select2({
                 <h3>select2-opening</h3>
                 <p>Fired before the dropdown is shown.</p>
                 <p>The event listener can prevent the opening by calling <code>preventDefault()</code> on the supplied event object.</p>
-                </p>
             </div>
         </div>
         <div class="row">
             <div class="span12">
                 <h3>select2-open</h3>
                 <p>Fired after the dropdown is shown.</p>
-                </p>
             </div>
         </div>
         <div class="row zebra">
             <div class="span12">
                 <h3>select2-highlight</h3>
                 <p>Fired when a choice is highlighted in the dropdown.</p>
-                </p>
                 <p>The event object contains the following custom properties:
                 <dl>
                     <dt>val</dt><dd>The id of the highlighted choice object.</dd>
                     <dt>object</dt><dd>The highlighted choice object.</dd>
                 </dl>
-                </p>
             </div>
         </div>
         <div class="row">
@@ -1817,13 +1812,11 @@ $("#e1").select2({
                 <h3>select2-selecting</h3>
                 <p>Fired when a choice is being selected in the dropdown, but before any modification has been made to the selection.
                     This event is used to allow the user to reject selection by calling <code>event.preventDefault()</code></p>
-                </p>
                 <p>The event object contains the following custom properties:
                 <dl>
                     <dt>val</dt><dd>The id of the highlighted choice object.</dd>
                     <dt>object</dt><dd>The choice object about to be selected.</dd>
                 </dl>
-                </p>
             </div>
         </div>
         <div class="row">
@@ -1831,7 +1824,6 @@ $("#e1").select2({
                 <h3>select2-clearing</h3>
                 <p>Fired when a choice is being cleared in the dropdown, but before any modification has been made to the selection.
                     This event is used to allow the user to reject the clear by calling <code>event.preventDefault()</code></p>
-                </p>
                 <p>For the clear button to be visible the <code>allowClear</code> option needs to be <code>true</code>.</p>
             </div>
         </div>
@@ -1840,38 +1832,32 @@ $("#e1").select2({
                 <h3>select2-removing</h3>
                 <p>Fired when a choice is about to be removed in the dropdown/input, but before any removal of the choice has been made.
                     This event is used to allow the user to reject removal by calling <code>event.preventDefault()</code></p>
-                </p>
                 <p>The event object contains the following custom properties:
                 <dl>
                     <dt>val</dt><dd>The id of the removing choice object.</dd>
                     <dt>object</dt><dd>The choice object about to be removed.</dd>
                 </dl>
-                </p>
             </div>
         </div>
         <div class="row zebra">
             <div class="span12">
                 <h3>select2-removed</h3>
                 <p>Fired when a choice is removed or cleared.</p>
-                </p>
                 <p>The event object contains the following custom properties:
                 <dl>
                     <dt>val</dt><dd>The id of the highlighted choice object.</dd>
                     <dt>object</dt><dd>The highlighted choice object.</dd>
                 </dl>
-                </p>
             </div>
         </div>
         <div class="row">
             <div class="span12">
                 <h3>select2-loaded</h3>
                 <p>Fired when query function is done loading the data and the results list has been updated</p>
-                </p>
                 <p>The event object contains the following custom properties:
                 <dl>
                     <dt>items</dt><dd>data that was used to populate the results.</dd>
                 </dl>
-                </p>
             </div>
         </div>
         <div class="row zebra">