Question

I am using prettyCheckboxes and I want to change it so that the div wrapper can also be clicked as well as the radio button. The currently JS for the radio button/label is

        $label = $('label[for="'+$(this).attr('id')+'"]');

        // Add the checkbox holder to the label
        $label.prepend("<span class='holderWrap'><span class='holder'></span></span>");

        // If the checkbox is checked, display it as checked
        if($(this).is(':checked')) { $label.addClass('checked'); };

        // Assign the class on the label
        $label.addClass(settings.className).addClass($(this).attr('type')).addClass(settings.display);

        // Assign the dimensions to the checkbox display
        $label.find('span.holderWrap').width(settings.checkboxWidth).height(settings.checkboxHeight);
        $label.find('span.holder').width(settings.checkboxWidth);

        // Hide the checkbox
        $(this).addClass('hiddenCheckbox');

        // Associate the click event
        $label.bind('click',function(){
            $('input#' + $(this).attr('for')).triggerHandler('click');

            if($('input#' + $(this).attr('for')).is(':checkbox')){
                $(this).toggleClass('checked');
                $('input#' + $(this).attr('for')).checked = true;

                $(this).find('span.holder').css('top',0);
            }else{
                $toCheck = $('input#' + $(this).attr('for'));

                // Uncheck all radio
                $('input[name="'+$toCheck.attr('name')+'"]').each(function(){
                    $('label[for="' + $(this).attr('id')+'"]').removeClass('checked');  
                });

                $(this).addClass('checked');
                $toCheck.checked = true;
            };
        });

and I want to make it so the $(this).parent() also calls the click function.

Any ideas how I could do this?

Answer 1

Using .add create a jQuery object that is self + parent:

var labelAndParent = $label.add($(this).parent());

Then bind to that object:

labelAndParent.bind('click',function(){
    // ...
});