¿Cómo mantener un div desplazado a la parte inferior a medida que se agrega contenido HTML a través de jquery, pero ocultar la barra de desplazamiento?

A continuación tengo un pequeño simulador basado en js para diferentes herramientas de comando. El usuario ingresa un comando, y si es correcto, lo muestra en la parte superior. Para usos futuros, debo asegurarme de que pueda manejar tantos comandos como sea necesario antes de completar la simulación. Esto significa que inevitablemente tendré contenido desbordante.

Mi solución ahora era configurar el desbordamiento de Y en automático, agregar la barra de desplazamiento y un poco de jQuery para mantener al cliente desplazado a la parte inferior del div de salida en todo momento, porque el contenido se agrega debajo del contenido anterior cada vez que un usuario ingresa El comando correcto.

Ahora mismo esto funciona bien, excepto que me gustaría quitar la barra de desplazamiento. Me gustaría que el contenido se comporte de la misma manera en que lo haría el desbordamiento automático, pero sin una barra de desplazamiento visible.

¿Hay alguna manera de que pueda hacer esto con jquery o javascript?

Sé que puedo hacer algunos trucos css para poner un poco de negro sobre la barra de desplazamiento con un índice z, pero me gustaría evitar eso si es posible.

Respuestas a la pregunta(4)

Su respuesta a la pregunta