Follow jQuery stacking elements behavior.

A better solution to #675
Fix #494

The behavior we were using for appendTo was incorrect, we should have
been modeling it on the stacking documentation:
https://api.jqueryui.com/theming/stacking-elements/

I alphabetized the properties in the multiselect css file becuase that
kind of thing makes me happy.

Author: mlh758

jquery.multiselect.css

@@ -1,30 +1,28 @@
 .ui-multiselect { padding:2px 0 2px 4px; text-align:left }
 .ui-multiselect span.ui-icon { float:right }
-.ui-multiselect-single .ui-multiselect-checkboxes input { position:absolute !important; top: auto !important; left:-9999px; }
+.ui-multiselect-single .ui-multiselect-checkboxes input { left:-9999px; position:absolute !important; top: auto !important; }
 .ui-multiselect-single .ui-multiselect-checkboxes label { padding:5px !important }
 
-.ui-multiselect-header { margin-bottom:3px; padding:3px 0 3px 4px }
+.ui-multiselect-header { margin-bottom:3px; padding:3px 0 3px 4px; }
 .ui-multiselect-header ul { font-size:0.9em }
-.ui-multiselect-header ul li { float:left; padding:0 10px 0 0 }
-.ui-multiselect-header a { text-decoration:none }
-.ui-multiselect-header a:hover { text-decoration:underline }
-.ui-multiselect-header span.ui-icon { float:left }
-.ui-multiselect-header li.ui-multiselect-close { float:right; text-align:right; padding-right:0 }
+.ui-multiselect-header ul li { float:left; padding:0 10px 0 0; }
+.ui-multiselect-header a { text-decoration:none; }
+.ui-multiselect-header a:hover { text-decoration:underline; }
+.ui-multiselect-header span.ui-icon { float:left; }
+.ui-multiselect-header li.ui-multiselect-close { float:right; padding-right:0; text-align:right; }
 
-.ui-multiselect-menu { display:none; padding:3px; position:absolute; z-index:10000; text-align: left }
-.ui-multiselect-checkboxes { position:relative /* fixes bug in IE6/7 */; overflow-y:auto }
-.ui-multiselect-checkboxes label { cursor:default; display:block; border:1px solid transparent; padding:3px 1px }
+.ui-multiselect-menu { display:none; padding:3px; position:absolute; text-align: left; }
+.ui-multiselect-checkboxes { overflow-y:auto; position:relative; }
+.ui-multiselect-checkboxes label { border:1px solid transparent; cursor:default; display:block; padding:3px 1px; }
 .ui-multiselect-checkboxes label input { position:relative; top:1px }
-.ui-multiselect-checkboxes li { clear:both; font-size:0.9em; padding-right:3px }
-.ui-multiselect-checkboxes li.ui-multiselect-optgroup-label { text-align:center; font-weight:bold; border-bottom:1px solid }
-.ui-multiselect-checkboxes li.ui-multiselect-optgroup-label a { display:block; padding:3px; margin:1px 0; text-decoration:none }
+.ui-multiselect-checkboxes li { clear:both; font-size:0.9em; padding-right:3px; }
+.ui-multiselect-checkboxes li.ui-multiselect-optgroup-label { border-bottom:1px solid; font-weight:bold; text-align:center; }
+.ui-multiselect-checkboxes li.ui-multiselect-optgroup-label a { display:block; margin:1px 0; padding:3px; text-decoration:none; }
 
 /* remove label borders in IE6 because IE6 does not support transparency */
 * html .ui-multiselect-checkboxes label { border:none }
 
 
 @media print{
-    .ui-multiselect-menu {display: none;}   
-    
+    .ui-multiselect-menu {display: none;}
 }
-

src/jquery.multiselect.js

@@ -44,11 +44,25 @@
       autoOpen: false,
       multiple: true,
       position: {},
-      appendTo: "body",
+      appendTo: null,
       menuWidth:null,
       selectedListSeparator: ', '
     },
 
+    _getAppendEl: function() {
+      var element = this.options.appendTo;
+      if(element) {
+        element = element.jquery || element.nodeType ? $(element) : this.document.find(element).eq(0);
+      }
+      if(!element || !element[0]) {
+        element = this.element.closest(".ui-front, dialog");
+      }
+      if(!element.length) {
+        element = this.document[0].body;
+      }
+      return element;
+    },
+
     _create: function() {
       var el = this.element;
       var o = this.options;
@@ -75,7 +89,7 @@
         this.menu = $('<div />')
           .addClass('ui-multiselect-menu ui-widget ui-widget-content ui-corner-all')
           .addClass(o.classes)
-          .appendTo($(o.appendTo));
+          .appendTo(this._getAppendEl());
 
         this.header = $('<div />')
           .addClass('ui-widget-header ui-corner-all ui-multiselect-header ui-helper-clearfix')