JSFiddle - React, Tailwind, and code Playground

HTML

<div id="logo">
    <img src="https://lh5.googleusercontent.com/-vxhx4nY6K2E/Thz7PF9kicI/AAAAAAAAAHw/k-pPuHaiDic/Holiday%252520Themed%252520Logo%252520Design_sample1.png" class="active"/>
    <img src="http://i.telegraph.co.uk/multimedia/archive/01369/Untitled-1_1369669c.jpg" />
  <img src="http://natehanson.com/images/webdesign.png" />
</div>

CSS

#logo{
    width : 300px;
    height : 120px;
    position : relative;
}
#logo img{
    width : 100%;
    height : 100%;
    position : absolute;
    top : 0;
    left : 0;
    z-index : 5;
}
#logo img.active{
    z-index : 10;
}

JavaScript

function switchLogo() {
    var activeImg = $('#logo .active'),
        nextImg = $('#logo :not(.active)');
    activeImg.fadeOut(500, function() {
        nextImg.addClass('active');
        activeImg.removeClass('active').css({
            opacity: 1,
            display: 'block'
        });
    });
}
setInterval(switchLogo, 2000);