How To Add And Remove Class On Radio Button?

I've problem when I found this one on JSFiddle http://fiddle.jshell.net/pepesustaita/sdL2v/ there has two radio for sampling, but I need that for more that 2.. $(document).ready(

Solution 1:

If I understand you correctly, you are looking for a more generic solution than assigning individual click handlers to each element? Perhaps, something along these lines:

$(document).ready(function(){
    $('input[type="radio"]').click(function(){
        $('input[type="radio"]').siblings().removeClass('active');
        $(this).next().next().addClass('active');
    });
});

This will attach the same click handler to each input of type radio. When a radio button is clicked, the active class is removed from all other radio buttons, and the active class is then added to the last clicked radio button.

Fiddle: http://fiddle.jshell.net/adrv14of/

Solution 2:

At first set a class for inputs then in Mousedown and MouseUp events write these codes:

$(document).on("mousedown",
            ".radio-type-input",
            function(ev) {
                $(".radio-type-input").removeClass("active");
            });

        $(document).on("mouseup",
            ".radio-type-input",
            function(ev) {
                $(ev.target).addClass("active");
            });