JSFiddle - React, Tailwind, and code Playground

HTML

<html>
    <body>
        <span id="div1" style="color:black;" onmouseover="stext" onmouseout="htext">TEXT1</span><p />
        <hr color="black" />
    <span id="div2" style="color:red;"onmouseover="htext" onmouseout="stext">Text2</span> 

    </body>
</html>

JavaScript

setInterval(function() {
    var x = document.getElementById("div1");
    var y = document.getElementById("div2");

    function stext() {
        x.style.color = 'red';
        y.style.color = 'black';
    }

    function htext() {
        x.style.color = 'black';
        y.style.color = 'red';
    }
}, 250);