Tengo un formato HTML como este:

<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>

Quiero obtener el siguiente elemento después de las fechas para obtener el correspondiente a la fecha. (El diseño es un poco más complejo, pero desde la fecha tiene clase desde la fecha y hasta la fecha tiene la clase hasta la fecha).

Esto es lo que estoy tratando de hacer, quiero tomar un elemento desde la fecha y encontrar el siguiente elemento en el dom con clase hasta la fecha. Intenté esto:

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

Pero me está dando el elemento jQuery vacío. Creo que esto es porquenext Da el siguiente hermano correspondiente al selector. ¿Cómo puedo obtener el correspondienteto-date?