Setting radio boxes to be checked with jQuery

Question

I have a page with some radio buttons that I want to be checked on page load. This is the jQuery that I'm using:

$('.optionHolder').find('input').first().attr('checked', 'true');

The one's I want checked are the first input elements of each .optionHolder on the page. At the moment there are two, but the code above is only checking one. Take a look at the image:

http://imgur.com/NQkei.jpg

As you can see, only the first set is being checked.

Any help would be appreciated, thanks.

Answer 1

Try

$('.optionHolder input:first-child').attr('checked', true);

first() will select the first element in a collection, whereas :first-child will select each element only if it is the first child of its parent.

:first works by selecting the first input element that is a child of .optionHolder:

$('.optionHolder input:first')