how to add class to div in which radio has certain value with jquery

if radio button checked add class to parent
add class when radio button checked
get selected value of radiobuttonlist in jquery
jquery if radio is checked add class
radio button group selected value jquery
if radio button checked jquery
jquery get radio button value on change
jquery set radio button checked based on value

I have this form with 4 radios:

<form class="options" method="post" id="question" action="index.php">
    <div class="form-check form-group"> 
        <label class="form-check-label">
            <input class='radio form-check-input' type='radio' name='radio' value='1' />Radio 1
        </label>
    </div>
    <div class="form-check form-group"> 
        <label class="form-check-label">
            <input class='radio form-check-input' type='radio' name='radio' value='2' />Radio 2
        </label>
    </div>
    <div class="form-check form-group"> 
        <label class="form-check-label">
            <input class='radio form-check-input' type='radio' name='radio' value='3' />Radio 3
        </label>
    </div>
    <div class="form-check form-group"> 
        <label class="form-check-label">
            <input class='radio form-check-input' type='radio' name='radio' value='4' />Radio 4
        </label>
    </div>

    <button type="submit" class="btn btn-success" name="next" value="next">NEXT</button>

</form

How can i add a class alert-success to the div above in which the radio has value 2 (with jquery)?

So:

 <div class="form-check form-group alert-success"> 
        <label class="form-check-label">
            <input class='radio form-check-input' type='radio' name='radio' value='2' />Radio 2
        </label>
    </div>

You can use the :has jQuery selector:

$('.form-group:has(input[value=2])').addClass('alert-success');

Radio button checked - add class to element, Get the current value of the first element in the set of matched elements or set the For selects, checkboxes and radio buttons, you can use :checked to select the right elements. <input type="text" value="some text"> This example removes leading and trailing whitespace from the values of text inputs with a "tags" class. Add two classes to an element How to add two class names to a specified element. Add classes using a function How to add classes to selected elements using a function. Change the class name of an element How to use addClass() and removeClass() to remove one class name, and add a new class name.

$('input[value=2]').closest('div').addClass('alert-success');

Also works..

.val(), As with other pseudo-class selectors (those that begin with a ":") it is recommended to precede it with a tag name or some other selector; otherwise, the universal selector ("*") is implied. set of associated radio buttons, you might use: $( "input[name=gender]:radio" <input type="button" value="Input Button"> <div></div>. Hi - i have 3 radio buttons each with its own colour - red - white - antique white how do i detect if a certain radio selection is checked and then add Radio button checked - add class to element - jQuery Forum

$('input').filter('[value=2]').closest('.form-group').addClass('alert-success');

:radio Selector, How about a 2 liner solution where you can convert the value using regex and toLowerCase() to transform the value into class name and instead of creating� In the above example, there are three radio buttons contains the result of the person. Click each button for the currently selected value of the radio button. 2. Use checked selector with val() to Get Selected Radio Button Value. You can also get the value of the selected radio button using the selector :checked with the function val().

Using jQuery to set the class of an element corresponding to the , Simple jQuery function to change class of labels when radio buttons are selected. select-change.html $(function() {. // When the value of the radio change. $('. It's important to note that this method does not replace a class. It simply adds the class, appending it to any which may already be assigned to the elements. Before jQuery version 1.12/2.2, the .addClass() method manipulated the className property of the selected elements, not the class attribute. Once the property was changed, it was the

Simple jQuery function to change class of labels when radio buttons , How to show and hide div elements based on the selection of radio buttons in jQuery example are hidden by default using the CSS display property which value is set to none . <div class="red box">You have selected <strong>red radio button</strong> so i am here</div> Here are some more FAQ related to this topic:. The .hasClass() method will return true if the class is assigned to an element, even if other classes also are. For example, given the HTML above, the following will return true : 1

Show Hide DIV Based on Radio Buttons Selection Using jQuery, Radio buttons are used where mutually exclusive options are given to user to select. <div class='radio-inline'> <label><input type='radio' name='r1' id='r1' We can read the user selected radio button value by using this in Jquery Based on the stored value of the record we will have one of the two radio button selected. We have find all radio button object using class selector, I have passed '.getvalue' class name into the jQuery selector. Then, found all the checked radio element and alert value. Option 2: Get The Value Of Selected Radio Button Using jQuery