selectbox list does not close on click

Question

I'm using niceselect for a custom selectbox. For some reason the selectbox does not close when an option is selected. I created a custom code to remove the open class from the selectbox element but it's not working...

var ns = $('.nice-select.open');
var ns_option = $('.nice-select.open li');

ns_option.on( "click", function() {
    ns.removeClass( "open" );
});

Any insight would be greatly appreciated

Answer 1

Try this:

var ns = $('.nice-select .open');
var ns_option = $('.nice-select .open li');

ns_option.on( "click", function() {
    ns.removeClass( "open" );
});

With jQuery, when selecting a class within a parent class, you need to have a space between each class name so rather than ".nice-select.open li" it should be ".nice-select .open li" as per the code above.

Answer 2

Issue was that it was trying to remove the class as it was being added by niceselect. This worked:

 $('.nice-select ul li').click(function() {
       setTimeout(function() {
            $('.nice-select').removeClass( "open" );
       }, 10);
  });