css selector for the label associated with a particular checkbox?

[tr888]

Checkbox and their labels are being rendered by Ext Designer not with the nested label syntax but with the "for={id}" syntax, like this:


<div id="ext-gen###" ... >
<input id = "foo" ... >
<label id = "ext-gen###" ... for="foo">foo label</label>
</div>


The DIV wrapper and label receive autogenerated ids. The checkbox input field has the id that I have assigned.
What is the CSS selector for the label associated with the checkbox whose id = "foo"? I don't want to reference the label by class x-form-cb-label.
Thanks

[jarrednicholls]

CSS3 Solution, which is not cross-browser compatible:



input#foo + label


Consider using an Ext.Element to get to the label programmatically, and perhaps applying your own CSS class or styles to the label element that way:



Ext.fly('foo').next().addClass('myCustomLabelClass');


See the documentation on Ext.Element:
http://www.extjs.com/deploy/dev/docs/?class=Ext.Element