[SOLVED]Find the correct label for input field
I want to make something that when I click a input field (so the input field has 'focus') , the corresponding label becomes bold.
I first wrote this:
Jquery:
-
$(document).ready(function(){
$("input").focus(function(){
var selectname = this.name;
$("input[name="+selectname+"]").prev().addClass("bold");
});
});
HTML
-
<label for="name">Name:</label>
<input name="Name" type="text"/>
<label for="email">E-mail:</label>
<input name="Email" type="text"/>
...
this works perfect, when i click the name input field, the name label becomes bold. When i click the email input field, the email label becomes bold, ...
But now I did change my HTML (so I could change some lay-out, ...)
the HTML looks like this now:
-
<dl>
<dt><label for="name">Name:</label></dt>
<dd><input name="name" type="text"/></dd>
<dt><label for="email">E-mail:</label></dt>
<dd><input name="email" type="text"/></dd>
...
</dl>
I did try several things, but nothing seems to work.
So what I have to change to my Jquery script to find the right label?