Javascript body text change when bg color changes NOT A DUPLICATE

Question

This is very similar to a previous question of mine but not the same, I am trying to learn the subtleties of Javascript.

Below is my code, I need to change the text in the body when the image changes, I think I am getting there and working it out but as you can see below, it is not yet exacly how i want it. I would be very very grateful if you can help me.

<script>
    $(document).ready(function() {
        element = $("#testElement");
        i = 1;

        setInterval(function() {
            element.removeClass("color"+i);
            console.log(i);
            i++

            if (i == 5) {
                i = 1;
            }

            element.addClass("color"+i);
        }, 1000);
    })

    var arr = ['hi','hello ','how ','are ','you '];                    
    changeColorAndText($('#testElement '), 0);
</script>

Thank you wonderful people in advance, you have taught me lots so far.

Answer 1

Working jsfiddle example

    <div id="testElement">This is your element</div>

    <script>
    $(document).ready(function() {

    element = $("#testElement");
var arr = ['hi','hello ','how ','are ','you ']; 

var i = 1; // localizing scope of this variable (not necessary)
    setInterval(function(){
        element.removeClass("color"+i);
        console.log(i);
        i++; // missing semicolon here
        if(i == 5)  i = 1;
        element.addClass("color"+i);
        element.text(arr[i]); // change the inner text of element

    }, 1000);
});

</script>