Question

I have the following structure:

<div id="1"><input class="a"></input><span class="b"></span></div>
    <div id="2"><input class="a"></input><span class="b"></span></div>
<div id="3"><input class="a"></input><span class="b"></span></div>

and I want to write a change() event which will apply to every input box. When the event is fired I want the innerhtml of the corresponding span tag to be updated with an *. How do I write a selector which will allow me to do this? I don’t think I can use the $(this) selector because how do I reach the span? Its not like its contained inside of the input. Is there a way to reference the parent (ie: div) and then move down to the span?

Answer 1

$('input.a').change(function() {
    $(this).next('span.b').text('*');
});