JSFiddle - React, Tailwind, and code Playground

by neuroflux

HTML

<div id="flashingtext">JavaScript Flashing Text</div>
<div id="flashingtext2">JavaScript Flashing Text</div>
<div id="flashingtext3">JavaScript Flashing Text</div>

CSS

body {
                background-color: #222222;
            }


            #flashingtext{
                font-family: Trebuchet MS, sans-serif;
                font-size: 24px;
                color: silver;
            }
            #flashingtext2{
                font-family: Trebuchet MS, sans-serif;
                font-size: 24px;
                color: silver;
            }
            #flashingtext3{
                font-family: Trebuchet MS, sans-serif;
                font-size: 24px;
                color: silver;
            }

JavaScript

function flashtext(ele,col) {
            var tmpColCheck = document.getElementById( ele ).style.color;

              if (tmpColCheck === 'silver') {
                document.getElementById( ele ).style.color = col;
              } else {
                document.getElementById( ele ).style.color = 'silver';
              }
            } 
            
            setInterval(function() {
                flashtext('flashingtext','red');
                flashtext('flashingtext2','blue');
                flashtext('flashingtext3','green');
            }, 500 ); //set an interval timer up to repeat the function