Bugged FadeIn

HTML

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>

	        <div class="col-lg-12 col-sm-12 col-xs-12 col-md-12" style="margin-top:100px;">
	            <div class="col-lg-4 col-sm-4 col-xs-4 col-md-4 emer1">
	                252 252 252
	            </div>
	            <div class="col-lg-4 col-sm-4 col-xs-4 col-md-4 emer2" style="display:none">
	                252 252 252
	            </div>
	            <div class="col-lg-4 col-sm-4 col-xs-4 col-md-4 emer3" style="display:none">
	                252 252 252
	            </div>
	        </div>

JavaScript

setInterval(function(){
    setTimeout(function(){
        $(".emer3").fadeOut("fast");
        $(".emer1").fadeIn("fast");
    }, 3000);
    
    setTimeout(function(){
        $(".emer1").fadeOut("fast");
        $(".emer2").fadeIn("fast");
    }, 3000);
    
    setTimeout(function(){
        $(".emer2").fadeOut("fast");
        $(".emer3").fadeIn("fast");
    }, 3000);
}, 9000);