jQueryMobile multi select issue after bundling

jQueryMobile multi select issue after bundling

Hello,

I am using jquery mobile custom selects menu with multiple options. ( http://demos.jquerymobile.com/1.4.3/selectmenu-custom/ )

Below are my mvc partial view code:
<label class="clsLabel" for="fruits">Select Fruits</label>
                <div class="ui-select CustomSelectClass">
                    @Html.DropDownList("fruits", Model.GetFruits, new { id = "fruits", @multiple = "multiple", @data_native_menu = "false", @class = "fruitClass" })
                </div>

Above code generates below HTML in DOM:
<div class="ui-popup-container ui-popup-active" id="fruits-listbox-popup" style="max-width: 345px; top: 297px; left: 76.5px;">
    <div id="fruits-listbox" class="ui-selectmenu ui-popup ui-body-inherit ui-overlay-shadow ui-corner-all">
        <div class="ui-header ui-bar-inherit">
            <h1 class="ui-title">Choose Fruits</h1>
            <a role="button" href="#" class="ui-btn ui-corner-all ui-btn-left ui-btn-icon-notext ui-icon-delete">Close</a>
        </div>
        <ul class="ui-selectmenu-list ui-listview" id="fruits-menu" role="listbox" aria-labelledby="fruits-button">
            <li data-option-index="0" data-icon="false" data-placeholder="true" class="ui-screen-hidden" role="option" aria-selected="false">
                <a href="#" tabindex="-1" class="ui-btn ui-checkbox-off ui-btn-icon-right">Choose fruits</a>
            </li>
            <li data-option-index="1" data-icon="false" class="ui-first-child" role="option" aria-selected="true">
                <a href="#" tabindex="-1" class="ui-btn ui-btn-icon-right ui-checkbox-on">Apple</a>
            </li>
            <li data-option-index="2" data-icon="false" class="" role="option" aria-selected="true">
                <a href="#" tabindex="-1" class="ui-btn ui-btn-icon-right ui-checkbox-on">Banana</a>
            </li>
            <li data-option-index="3" data-icon="false" class="" role="option" aria-selected="true">
                <a href="#" tabindex="-1" class="ui-btn ui-btn-icon-right ui-checkbox-on">Mango</a>
            </li>
            <li data-option-index="4" data-icon="false" class="" role="option" aria-selected="true">
                <a href="#" tabindex="-1" class="ui-btn ui-btn-icon-right ui-checkbox-on">Grapes</a>
            </li>
            <li data-option-index="5" data-icon="false" class="" role="option" aria-selected="true">
                <a href="#" tabindex="-1" class="ui-btn ui-btn-icon-right ui-checkbox-on">Orange</a>
            </li>
            <li data-option-index="6" data-icon="false" class="ui-last-child" role="option" aria-selected="true">
                <a href="#" tabindex="-1" class="ui-btn ui-btn-icon-right ui-checkbox-on">Lichi</a>
            </li>
        </ul>
    </div>
</div>

The problem is multipe select option does not works if i do bundling. It works fine without bundling.

I want to work this multiple select using after bundling. So request to please help me on this to fix this issue.

Thanks,
Jignesh