У меня есть HTML-разметка, как это:

<p>
  <label>Arrive</label>
  <input id="from-date1" class="from-date calender" type="text" />
</p>

<p>
  <label>Depart</label>
  <input id="to-date1" class="to-date calender" type="text" />
</p>

<p>
  <label>Arrive</label>
  <input id="from-date2" class="from-date calender" type="text" />
</p>

<p>
  <label>Depart</label>
  <input id="to-date2" class="to-date calender" type="text" />
</p>

Я хочу получить следующий элемент после даты, чтобы получить соответствующую дату. (Компоновка немного сложнее, но с даты имеет класс с даты и до даты имеет класс с датой).

Это я пытаюсь сделать, я хочу взять элемент from и найти следующий элемент в dom с текущим классом. Я попробовал это:

$('#from-date1').next('.to-date')

но это дает мне пустой элемент jQuery. Я думаю это потому чтоnext дает следующий брат, соответствующий селектору. Как я могу получить соответствующийto-date?