multipleSelect() not working properly on dynamically added <select>

Solution 1:

For dynamic content you'll either have to set an observer to notice when the content is added, or call your function AFTER the content has been added.

jQuery works asynchronously, so when you're using .html() and using your selector right afterwards, chances are (as in - almost guaranteed) that the html-code has not arrived in the DOM yet. You can use .promise() to make sure that your .html() function has finished before using your selector.

Solution 2:

You could apply a specific class to the select on its "creation" time
Also note, that you don't need to search DOM for $("#multiple-select"), use chaining instead:

$("<select multiple id='multiple-select'>"+
      "<option value='1'>Apples</option>"+
      "<option value='2'>Oranges</option>"+
  "</select>"
)
.addClass('wide')
.appendTo("#wrapper")
.multipleSelect();

CSS:

.wide {
    min-width:200px;
}

DEMO