Rendering issues when applying custom <select> in Bootstrap

Question

I am using bootstrap-select.min.js with bootstrap 3 to apply custom theme to my select tag. It has a simple jQuery function to apply the theme.

$('.selectpicker').selectpicker();

What happening is that this only works inside $(document).ready(function(). So it is showing the default HTML layout of <select> before applying the custom theme. It looks bad and also makes the layout of my bootstrap navigation bar uneven.

JSFIDDLE

Answer 1

It works after applying it inside window.load function instead of document.ready

$(window).load(function() 
{
   $('.selectpicker').selectpicker();
});