JSFiddle - React, Tailwind, and code Playground

by ric47121

HTML

<script type="text/javascript" src="http://ricardolevano.com.ar/test/test_resaltado_jquery_by_rck/jquery.resaltado.js"></script> 

Historia
<div id="loguer_conteiner" >
<ul id="loguer-rck">
    <li> <span>2:20 pm :</span> pjuan subio un documento.</li>
    <li> <span>1:15 pm :</span>  rlucia acaba de iniciar session.</li>
    <li> <span>12:20 am :</span>  mmelani subio un documento.</li>
    <li> <span>11:10 pm :</span>  rlucia (RRHH) a haceptado el documento 215/2012 .</li>
    <li> <span>10:09 pm :</span>  jperza caba de iniciar session.</li>
    <li> <span>10:08 pm :</span>  prlone acaba de iniciar session.</li>
</ul>
</div>

<br/>
<input type="button" value="add" onclick="agregarEvento()">
<input type="button" value="clear" onclick="$('#loguer-rck').empty()">

CSS

#loguer_conteiner{
    height: 120px;
    width: 280px;
    border: 1px solid green;
    overflow-y:auto;
}
#loguer-rck li{
    padding: 2px;
}

#loguer-rck span{
    /*background-color: green;*/
    color: green;
    
}

JavaScript

var events =[
    {id:'2', msj: 'malone code', fecha: '2012-03-15 14:20:01'}
            
            ];


//$("#loguer-rck").empty();

function agregarEvento(){
    //var loguer = $("#loguer-rck");
    var item = '<li> <span>3:05 pm :</span>  un nuevo item.</li>';
    $("#loguer-rck").prepend(item);
    
    $("li:eq(0)").resaltar();
    
    //console.log("agregado")

     //   $("#loguer_conteiner").scrollTop(9999);
    $("#loguer_conteiner").animate({scrollTop:0}, 'slow');
}