JSFiddle - React, Tailwind, and code Playground
HTML
<div class="newsticker">
</div>
CSS
div.newsticker{
border:1px solid #666666;
width:100%;
height:100px;
padding: 0px;
margin: 0px;
}
.newsticker p{
padding-left:10px;
padding-right:10px;
float:left;
position:absolute;
line-height: 100px;
padding: 0px;
margin: 0px;}
JavaScript
function transition() {
$('.newsticker p').animate({"marginLeft":"400px","opacity":".0"}, 600).fadeOut(100);
$('.newsticker').append("<p style='margin-left:400px;opacity:0'>Hello! This is a test</p>");
$('.newsticker p').animate({"marginLeft":"0px","opacity":"1"}, 600);
}
setInterval(transition, 2000);