Find html label associated with a given input

Question

Let's say I have an html form. Each input/select/textarea will have a corresponding <label> with the for attribute set to the id of it's companion. In this case, I know that each input will only have a single label.

Given an input element in javascript — via an onkeyup event, for example — what's the best way to find it's associated label?

Answer 1

If you are using jQuery you can do something like this

$('label[for="foo"]').hide (); 

If you aren't using jQuery you'll have to search for the label. Here is a function that takes the element as an argument and returns the associated label

function findLableForControl(el) {    var idVal = el.id;    labels = document.getElementsByTagName('label');    for( var i = 0; i < labels.length; i++ ) {       if (labels[i].htmlFor == idVal)            return labels[i];    } }