JSFiddle - React, Tailwind, and code Playground

HTML

<div id="twitter-feed">
    <div class="twitter-article">Tweet 1</div>
    <div class="twitter-article">Tweet 2</div>
    <div class="twitter-article">Tweet 3</div>
    <div class="twitter-article">Tweet 4</div>
    <div class="twitter-article">Tweet 5</div>
    <div class="twitter-article">Tweet 6</div>
</div>

CSS

#twitter-feed{
	 border: 1px solid black;
    height: 100px;
    overflow: hidden;
    width: 500px;
    float: left;
	}


.twitter-article {

	float: left;
	width: 200px;
	border: 1px solid red;
		height: 100px;
margin-left: 40px;

JavaScript

function fadeOut(elements, callback)
{
    if (elements.length){
        elements.eq(0).addClass('fade');
        elements.eq(0).delay( 5000 ).fadeOut(3000, function(){
			$('.fade').appendTo('#twitter-feed');
			$('.fade').css('display', 'block');
            $('.fade').removeClass('fade');
            fadeOut(elements.slice(1 ,1), callback);
        });
    }
    else {
        callback();
    }
}
function infinite(){
    fadeOut($('#twitter-feed div'), function(){ 
            infinite();
    });
}
$(function(){
    infinite();
});