update character counter of an input

Question

I have a page on which you can add fields where by clicking "create new field" opens a modal with a input with a character counter and two buttons, you can add as many fields as you want. However, when I create the first one, the value that remains of this counter (let’s assume that it is 14 car. remaining), is the value that appears when I create a new field and open a new modal. Just update, that is, back to the maximum number of characters allowed (20) when I click on the input to write.

I created these Elements to update:

  element.focus(updateCounter).change(updateCounter);
  element.keyup(updateCounter).change(updateCounter);

There’s something like this I can do to update as soon as the modal open, before doing focus in the input?