Better jQuery code to select a radio button if none are selected?

Question

I have this code, which works fine:

if ( $('table#attribute_Size input.quantitycheckbox:checked').length == 0 )
    $('table#attribute_Size input.quantitycheckbox:first').attr({ checked: true });

As you can see though, it's pretty long and most of the selector is repeated. Is there a neat was to shorten it? I tried this but it doesn't work (I assume it's looking at nested elements instead of the current selector).

var $sizeRadios = $('table#attribute_Size input.quantitycheckbox');
if ( $(':checked', $sizeRadios).length == 0 )
    $(':first', $sizeRadios).attr({ checked: true });

Answer 1

You can make it a little bit shorter by removing the "table" at the beginning of each selector. It is 100% unnecessary and actually slows down jQuery. You could also cache the table jQuery object like so:

var $table = $('#attribute_Size');
if ($('input.quantitycheckbox:checked', $table).length == 0 )
    $('input.quantitycheckbox:first', $table).attr('checked', true);

Answer 2

You could try this... it's a little shorter. I haven't tested but should work.

var $sizeRadios = $('#attribute_Size input.quantitycheckbox');
if ( !$sizeRadios.is(":checked") )
    $sizeRadios.eq(0).attr("checked", true);

Answer 3

You can also write:

var $table = $('#attribute_Size');
if (!$table.find('input.quantitycheckbox').is(':checked'))
  $table.find('input.quantitycheckbox:first').attr('checked', true);

Not really "better" or anything, just a different style.

[edit] oh I like @Lindsay's better.

Answer 4

One select query:

$('#attribute_Size:not(:has(input.quantitycheckbox:checked)) input.quantitycheckbox:first').attr({ checked: true });