JavaScript - Convertir listbox a editable

Saludos.

Quisiera que alguien haya logrado cambiar un listbox para que sea editable y se pueda agregar datos a la base de datos sin necesidad de usar un objeto text adicional...

Ejemplo

Extraigo una lista de ciudades desde una tabla de la base de datos con los cuales asigno
la lista de valores del listbox (en la forma al lado del listbox como ejemplo habria un objeto que indicaría que pueda incluir con un icono con la figura de "agregar", o al dar dobleclick con el ratón).
Si en la lista no esta la población, el usuario presionaría sobre el icono (o dar dobleclick) y quiero que el listbox se convierta en editable para que el usuario escriba la nueva población sobre el mismo objeto.... se incluirìa la nueva población en el proceso de actualización de la base de datos (eso ya lo tengo desarrollado).,

Lo de la forma y como llega a la base de datos y se actualiza está desarrollado, asi que lo que deseo es el código javascript que logre esto si es posible.

Espero haberme explicado bien y muchas gracias por la atención.

Si con listbox te refieres a un elemento "SELECT" con opciones de html, creo que no es posible editarlo sin utilizar un input externo.

pero si utilizas otros elementos ya sea div, p, input ...etc puedes utilizar contenteditable="true" en el elemento para editarlo sin necesidad de un tercero
por ejemplo:

Gracias por la amabilidad y tu tiempo de responder.
L.T.