JSFiddle - React, Tailwind, and code Playground

by majidf

HTML

<aside id="eTRRibbons">
    <img id="eTR1" src="/img/logo.png">
    <img id="eTR2" src="/img/logo.png">
    <img id="eTR3" src="/img/logo.png">
</aside>
<aside id="eBLRibbons">
    <img id="eBL1" src="/img/logo.png">
    <img id="eBL2" src="/img/logo.png">
    <img id="eBL3" src="/img/logo.png">
</aside>

CSS

img {
    display: none;
}

JavaScript

$("#eTR1").bind("load", function() {
    $(this).fadeIn(10000);
});
$("#eTR2").bind("load", function() {
    $(this).fadeIn();
});
$("#eTR3").bind("load", function() {
    $(this).fadeIn();
});
$("#eBL1").bind("load", function() {
    $(this).fadeIn();
});
$("#eBL2").bind("load", function() {
    $(this).fadeIn();
});
$("#eBL3").bind("load", function() {
    $(this).fadeIn();
});