This is not tested, but should work.
There is a + CSS selector that you can use in conjunction with HTML elements and CSS classes and ID’s. I’d suggest you do something similar to this to avoid all the hassle of figuring out a way to inject an ID into each radio button:
/* selects the first label element related to the first radio button,
* the '+' part selects only the element that comes IMMEDIATELY after
* the previously stated selector. The ':before' pseudo-class will allow
* you to inject an image before the content.
*/
#test01+input:before {
/* something similar to this */
content: url('image.jpg');
}
I would check out this article, which should be a more detailed walkthrough of everything you need for this. Alternatively – you could use jQuery, which should work something like this:
$('#test01+input').attr('id', 'your-id-value');
Again, this is untested, but this should allow you to dynamically add an ID attribute to any of those elements, which you can then manipulate with CSS. I don’t know if this will solve your problem or not, but hopefully it gets the wheels turning 🙂