Heed help to rearrange letters in a block of text

I’m a newbie in coding. so this may be a small problem.
So I need a script which can retype a block of text into another block of text when you click on a button.
Example:
“Hello” to “Goodby”.
Hello > Hollo > Hoolo > Goolo > Gooloe > Goodoe > Goodye > Goodbye.
The script must pick a random letter and change it into the letter from another text. There must be a short delay after each change, so it looks like text is randomly retyping.
This is the scheme of the solution I see.

Firstly I tried to do it with console.log to see how it works.
Unfortunatelly it doesn’t work.
It changes strings randomly as supposed, but it doesn’t end. And my browser constantly loading the page, so I cannot interact with it at all.

The code below

"use strict";
var desc1 = 'Hello';
var desc2 = 'Goodbye';
desc1 = desc1.split('');
desc2 = desc2.split('');

function randomInteger(min, max) {
    let rand = min + Math.random() * (max + 1 - min);
    return Math.floor(rand);
}

console.log (desc1);
if(desc1 > desc2){
    var descLenght = desc1.length;
} else {
    var descLenght = desc2.length;
}


// function retext

while (desc1 != desc2) {
    let i = randomInteger(0, descLenght);
    if (desc1[i] !== desc2[i]) {
        desc1[i] = desc2[i];
        console.log (desc1);
    }
}

The first question:
Can you help me find the mistakes in my code?
The second question:
To make it slowly apper on a page I need to create a function with settimeout(0.05 sec) and use element.innerHTML instead of console.log. Am I right?

Thanks in advance for your help

What is the purpose of this comparison?

randomInteger(min, max) gives a radnom number
I use it to pick a random letter from the text.
so random number of letter “i” must be from 0 to max lenght of one of the arrays

We have two arrays

[0]H   [0]G
[1]e   [1]o
[2]l   [2]o 
[3]l   [3]d 
[4]o   [4]b
[5]    [5]y
[6]    [6]e

Random number of leter must be from 0 to 6 (from 0, to lenght of the max array)
“if(desc1 > desc2){” choose the max array.

Because you convert desc1 and desc2 into arrays of the same name, this while loop condition will always be true. Why? Because array variables are references to locations in memory containing the data for the array. You are comparing memory locations instead of the contents of those memory locations. You could convert them back to strings and make a comparison like this though. The biggest issue you are going to face with your current logic track is since desc1 and desc2 can be different lengths and you are replacing values at the index of one text with values at the same index of a text of different length, you will never be able to make the words match.

if(desc1 > desc2){

Similar to what I stated above, you can not compare arrays that way. You could compare the length of the arrays or use Math.max(desc1.length, desc2.length) to get the length of the longest array.

Also what if you are supposed to convert the word “Goodbye” to “Hello”? How will you deal with that situation?

I started with thar order of words because I knew that I need to delete all the empty data from array if I need to convert “Goodbye” to “Hello”. I choose to do easy variant of problem because I’m not sure I can solve it right now, but I can try to create a simple version of the code.

Thank you for spending your time on me, you really helped me.
I rewrite the code and looks like it works

"use strict";
var desc1 = 'Hello friend';
var desc2 = 'Good';


function randomInteger(min, max) {
    let rand = min + Math.random() * (max + 1 - min);
    return Math.floor(rand);
}

console.log(desc1);

// function retext

while (desc1 != desc2) {
    desc1 = desc1.split('');
    desc2 = desc2.split('');
    let i = randomInteger(0, Math.max(desc1.length, desc2.length));
    if (desc1[i] !== desc2[i]) {
        desc1[i] = desc2[i];
        desc1 = desc1.join('');
        desc2 = desc2.join('');
        console.log(desc1);
    } else {
        desc1 = desc1.join('');
        desc2 = desc2.join('');
    }

}