Можно ли установить ширину элемента равной ширине предыдущего элемента?

Question

За моими входными элементами следует div. Я хотел бы установить ширину этого div равной ширине предыдущего элемента ввода.

<input type="text" class="input" size="100" name="data"/>
<div class="inputHelp"> enter data above </div>

<input type="text" class="input" size="80" name="moredata"/>
<div class="inputHelp"> enter more data above </div>

В каждом случае класс .inputHelp должен иметь такую ​​же ширину, что и элемент input перед ним.

Используя селектор next , я смог получить ширину элементов ввода, а затем div inputHelp. Однако, при попытке установить ширину следующего элемента inputHelp, он вместо этого устанавливает ширину ВСЕХ элементов div inputHelp на странице. Как я могу ограничить его, чтобы установить только ширину следующего inputHelp, а затем перебрать все другие комбинации input + inputHelp на странице?

Вот мой текущий код JQuery:

$('.input + .inputHelp').width( $('.inputHelp').prev('.input').width() );

Answer 1

$('.input + .inputHelp').each(function() {
    $(this).width($(this).prev('.input').width();
});

Ключом к решению является использование $(this), а не $('.inputHelp'). Последний захватывает все .inputHelps глобально, а не тот, на котором вы зацикливаетесь.

Answer 2

Интересно, нужно ли каждое. - Я просто собираюсь запустить свою среду разработки и протестировать - больше, чем просто любопытство, поскольку вы уже отметили правильный ответ Стюарта Б. (какой он есть)

Не будет ли следующее эквивалентным:

$('.input + .inputHelp').width( $(this).prev('.input').width() );

Я дополню это комментарием, когда буду возиться, но как кто-то, изучающий jQuery myselft, я бы хотел узнать, эквивалентны ли они, а если нет, то почему.

Спасибо, Терри