jScrollPane on select2

HTML

<script src="//cdn.jsdelivr.net/select2/3.4.3/select2-spinner.gif"></script>
<link rel="stylesheet" href="//cdn.jsdelivr.net/select2/3.4.3/select2.css">
<script src="//cdn.jsdelivr.net/select2/3.4.3/select2.min.js"></script>
<script src="//cdn.jsdelivr.net/select2/3.4.3/select2.png"></script>
<script src="//cdn.jsdelivr.net/select2/3.4.3/select2x2.png"></script>
<link rel="stylesheet" href="https://css45.googlecode.com/files/jquery.mCustomScrollbar.css">
<script src="//cdn.jsdelivr.net/jquery.mcustomscrollbar/2.8.1/jquery.mCustomScrollbar.min.js"></script>
<select class="select2">
    <option value="A">Value A</option>
    <option value="B">Value B</option>
    <option value="C">Value C</option>
    <option value="D">Value D</option>
    <option value="E">Value E</option>
    <option value="F">Value F</option>
    <option value="G">Value G</option>
    <option value="H">Value H</option>
    <option value="I">Value I</option>
    <option value="J">Value J</option>
</select>

CSS

/* basic scrollbar styling */
/* vertical scrollbar */
.mCSB_container{
	width:auto;
	margin-right:30px;
	overflow:hidden;
}
.mCSB_container.mCS_no_scrollbar{
	margin-right:0;
}
.mCS_disabled>.mCustomScrollBox>.mCSB_container.mCS_no_scrollbar,
.mCS_destroyed>.mCustomScrollBox>.mCSB_container.mCS_no_scrollbar{
	margin-right:30px;
}
.mCustomScrollBox>.mCSB_scrollTools{
	width:16px;
	height:100%;
	top:0;
	right:0;
}
.mCSB_scrollTools .mCSB_draggerContainer{
	position:absolute;
	top:0;
	left:0;
	bottom:0;
	right:0; 
	height:auto;
}
.mCSB_scrollTools a+.mCSB_draggerContainer{
	margin:20px 0;
}
.mCSB_scrollTools .mCSB_draggerRail{
	width:2px;
	height:100%;
	margin:0 auto;
	-webkit-border-radius:10px;
	-moz-border-radius:10px;
	border-radius:10px;
}
.mCSB_scrollTools .mCSB_dragger{
	cursor:pointer;
	width:100%;
	height:30px;
}
.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{
	width:4px;
	height:100%;
	margin:0 auto;
	-webkit-border-radius:10px;
	-moz-border-radius:10px;
	border-radius:10px;
	text-align:center;
}
.mCSB_scrollTools .mCSB_buttonUp,
.mCSB_scrollTools .mCSB_buttonDown{
	display:block;
	position:relative;
	height:20px;
	overflow:hidden;
	margin:0 auto;
	cursor:pointer;
}
.mCSB_scrollTools .mCSB_buttonDown{
	top:100%;
	margin-top:-40px;
}
/* horizontal scrollbar */
.mCSB_horizontal>.mCSB_container{
	height:auto;
	margin-right:0;
	margin-bottom:30px;
	overflow:hidden;
}
.mCSB_horizontal>.mCSB_container.mCS_no_scrollbar{
	margin-bottom:0;
}
.mCS_disabled>.mCSB_horizontal>.mCSB_container.mCS_no_scrollbar,
.mCS_destroyed>.mCSB_horizontal>.mCSB_container.mCS_no_scrollbar{
	margin-right:0;
	margin-bottom:30px;
}
.mCSB_horizontal.mCustomScrollBox>.mCSB_scrollTools{
	width:100%;
	height:16px;
	top:auto;
	right:auto;
	bottom:0;
	left:0;
	overflow:hidden;
}
.mCSB_horizontal>.mCSB_scrollTools a+.mCSB_draggerContainer{
	margin:0 20px;
}
.mCSB_horizontal>.mCSB_scrollTools .mCSB_draggerRail{
	width:100%;
	height:2px;
	margin:7px...

JavaScript

$(document).ready(function () {
    $("select").select2({ minimumResultsForSearch: -1 });

    $(document).on("select2-open", "select", function () {
        var el;
        $('.select2-results').each(function () {
           var api = $(this).data('jsp');
           
            if (api !== undefined) api.destroy();
        });

        $('.select2-results').each(function () {
            if ($(this).parent().css("display") != 'none') el = $(this);

            if (el === undefined) return;

            el.mCustomScrollbar({
                mouseWheel:true,
                advanced:{
                    updateOnContentResize: true
                }
              });
        });
    });
});