Radio Carousel Radio Uttons

Question

I am using the plugin Owl-Carousel 2.0.0, to make a Carousel of images packaging products that are selectable, through a radio input, only one package must be selected, the structure of this Carousel is as follows, the container is a <label> and inside it is the input[type=radio] and the image of the product <img> when you click on the item of Carousel, which in this case is the label, it changes the radio input state to checked, I want to take this event and add a class on the label whenever this radio input is checked, and when I select another radio button it removes the class from the other item and adds in the current one.

I made a small script but currently it does not do well what I want, when selecting another radio it keeps the class in the previous label, maybe it is my logic that is wrong. follows script:

http://jsfiddle.net/og7ee99s/2/

Answer 1

Try to take the class out of all Abels before. This should work:

$('input[name=pack]').on('click', function() {
   $('.owl-item').find('.product').removeClass('active');
   if( $(this).is(':checked') ) {
      $(this).parent().addClass('active');
   }
});