JSFiddle - React, Tailwind, and code Playground

by Simon Price

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="panel panel-default notifications">
									<div class="panel-heading">
										<h3 class="panel-title">
											Notifications
                      </h3>
									</div>
									<div class="panel-body">
                                        <div id="Notifications">
                                            
                                        </div>
										

									</div>
								</div>

JavaScript

$(document).ready(function(){

GetDashboardNotifications();

})

function GetDashboardNotifications(){

		//alert("clicked");
    var alertType = "alert-info"
    var d = new Date();
    var strDate = d.getFullYear() + "/" + (d.getMonth()+1) + "/" + d.getDate();
    
    var t = new Date();
    var time = t.getHours() + ":" + t.getMinutes() + ":" + t.getSeconds();
    var description = "some info description"
    
    var notificationhtml = "";
    
    //alert(notificationhtml)
    notificationhtml = notificationhtml + "<div id=\"1\" class=\" collapse alert " + alertType + " alert-dismissible\" role=\"alert\">";
    notificationhtml = notificationhtml + "  <strong>" + strDate + " " + time +  "</strong><br/> ";
    notificationhtml = notificationhtml + "  <p>" + description + "</p> ";
    notificationhtml = notificationhtml + "</div>";
    
    //alert(notificationhtml);
    
  $("#Notifications").prepend(notificationhtml)
  $("#1").slideDown("slow");
  

                var $articleCount = $('#Notifications > div').length;
                console.log($articleCount);
                while ($articleCount > 5) {
                    $('#Notifications > div:last-child').remove();
                    $articleCount = $('#Notifications > div').length;
                }

                //currently set at 15 seconds

    setTimeout(GetDashboardNotifications, 5000);

}