Переключить фокус на следующее поле ввода, когда будет достигнута максимальная длина

Я хочу изменить фокус fechaI после того, как он достигнет максимальной длины (которая равна 2), и установить фокус на mesI. Заранее спасибо и извините за мой английский, а не мой основной.

<h:form id:form>
...
<h:inputText id="fechaI" value="#{solicitud.fechaI}" maxlength="2" size="2">
<a4j:ajax event="change" render="fechaI"/> 
</h:inputText>

<h:inputText id="mesI" value="#{solicitud.mesI}" maxlength="2" size="2" >
<a4j:ajax event="change" render="mesI"/> 
</h:inputText>

<h:inputText id="anoI" value="#{solicitud.anoI}" maxlength="4" size="4" >
<a4j:ajax event="change" render="anoI"/> 
</h:inputText>
...
</h:form>

ОБНОВЛЕНИЕ моего кода, все еще не работающего:

<h:form id="form">
    <h:inputText id="fechaI" value="#{solicitud.fechaI}" maxlength="2" size="2" tabindex="1"/>
    <h:inputText id="mesI" value="#{solicitud.mesI}" maxlength="2" size="2" tabindex="2" />
    <h:inputText id="anoI" value="#{solicitud.anoI}" maxlength="4" size="4"  tabindex="3" />
</h:form>
<script type="text/javascript">
    //<![CDATA[
  $('input[maxlength][tabindex]').on('keyup', function() {
    $this = $(this);
    if ($this.val().length == $this.attr('maxlength')) {
        $('input[maxlength][tabindex=' + ($this.attr('tabindex') + 1) + ']').focus();
    }
  });
//]]>
</script>