Bootstrap-Select: Focus state on the button not being removed when dropdown expanded

Question

I am using the Bootstrap-select plugin for multiple select dropdowns on my site and for some reason when I expand the dropdown list using the arrow keys the focus is staying on the button that triggers the dropdown and not moving to the items in the list.

This is my basic markup for the select using the class 'selectpicker' to trigger the bootstrap-select plugin.

<select class="selectpicker" multiple>
     <option value="option 1">Option 1</option>
     <option value="option 2">Option 2</option>
     <option value="option 3">Option 3</option>
</select

A <button> that triggers the dropdown list and a <div> holding the list items is then generated by the bootstrap-select plugin and appended after the <select>.

Is there any idea what could be causing this? This is affecting my accessibility because screen readers aren't reading the items in the dropdown list because the focus stays on the <button>.

Any help with this would be appreciated.