Cambiar texto poco a poco

[patilanz]

Hola quiero hacer que cando se pulsa un boton el texto aparesca poco a poco de modo que en algunos segundos se ha mostrado pero que sea de esta manera:
1: T
2: Te
3:Tex
4:Text
5:Texto
He intentado hacer lo con este codigo :

Código Javascript:

function mostrar_restaurantea() {
    var b = Array('Б','ъ','л','г','а','р','с','к','и',' ','р','е','с','т','о','р','а','н','т',' ','п','р','е','д','л','а','г','а',' ','а','в','т','е','н','т','и','ч','н','a','Б','ъ','л','г','а','р','с','к','а',' ','к','у','х','н','я',' ','в',' ','у','ю','т','н','а',' ','о','б','с','т','а','н','о','в','к','а',' ','в',' ','г','р','а','д',' ','К','а','р','л','о','в','о','.');
    var asd1;
    asd1 += 1;
    var o = '';
    o += b[asd1];
    document.getElementById('contenido').innerHTML = o;
    if(asd1 > 89) {
        clearInterval('interval');
    }
    
}
function mostrar_restaurante() {
    var titulo = 'Ресторант фиеста';
    var b = Array('Б','ъ','л','г','а','р','с','к','и',' ','р','е','с','т','о','р','а','н','т',' ','п','р','е','д','л','а','г','а',' ','а','в','т','е','н','т','и','ч','н','a','Б','ъ','л','г','а','р','с','к','а',' ','к','у','х','н','я',' ','в',' ','у','ю','т','н','а',' ','о','б','с','т','а','н','о','в','к','а',' ','в',' ','г','р','а','д',' ','К','а','р','л','о','в','о','.');
    var indice;
    var ind = 50;
    var h;
 
    
    
    
 
    
        for(indice = 1; indice < b.length; indice ++) {
        interval = setTimeout('mostrar_restaurantea()',ind);
        ind += 50;
        }
 

Pero no me funciona...
Alguna manera de hacer lo ?
Este efecto tiene su propio nombre?

Gracias :)