How to show elements on selected radio buttons?

Question

        <input id="auto" type="radio" name="warning_type" value="auto"> <label for="auto">Auto-varning</label> <br>
        <input id="manual" type="radio" name="warning_type" value="custom"> <label for="custom">Custom</label> <br>

Is what i have.

How can i show #warning_custom when you choose "manual" and #warning_auto when you choose "auto"?

And if you choose #warning_custom(manual) then the #warning_auto should hide and same should happen the opposite way.

How can i do this? I tried but i cant manage to so the one shows only and the other hides again..

Answer 1

I'm guessing as to what the rest of your code looks like:

$("input:radio").click(function() {
    if ($(this).val()=="auto") {
        $("#warning_custom").hide();
        $("#warning_auto").show();
    } else {
        $("#warning_auto").hide();
        $("#warning_custom").show();
    }
});