jquery: how to check if all radio buttons in a div are selected

Question

my html looks like this

<div id="div1">   <input type="radio" name="r1" value="v1" />   <input type="radio" name="r1" value="v2" />   <input type="radio" name="r1" value="v3" />    <input type="radio" name="r2" value="v1" />   <input type="radio" name="r2" value="v2" />   <input type="radio" name="r2" value="v3" />    <input type="radio" name="r3" value="v1" />   <input type="radio" name="r3" value="v2" />   <input type="radio" name="r3" value="v3" /> </div> 

radio buttons are dynamically generated on my html so in that div i don't know how many radio buttons i have.

i want to make sure that the user will select a value for each one of them before he submits the form, how can i check that all radio buttons inside my div has a value checked?

Thank you

Answer 1

$(":radio").change(function() {     var names = {};     $(':radio').each(function() {         names[$(this).attr('name')] = true;     });     var count = 0;     $.each(names, function() {          count++;     });     if ($(':radio:checked').length === count) {         alert("all answered");     } }).change(); 

Demo: http://jsfiddle.net/yFaAj/15/