Skip welcome & menu and move to editor
Welcome to JS Bin
File
Add library
Share
Login or Register
Blog
Help
Load cached copy from
  • Run with JS
  • Save
  • Share
  • …
 
<!DOCTYPE html>
<html>
<head>
<script src="https://code.jquery.com/jquery-1.9.1.js"></script>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width">
  <title>JS Bin</title>
</head>
<body>
<input type="button" value="Carregar Usuarios" onclick="listaUsuarios();">
  <div class="content-block-title">Lista Usuários</div>
                    <div class="list-block">
                      <ul id='usuarios'>
                        
                          
                        
                      </ul>
                    </div>
                  </div>
</body>
</html>
 
​
 
data = [{"nome":"Jesus", "email":"email@email.com"},
        {"nome":"maria", "email":"email@email.com"},
        {"nome":"jose", "email":"email@email.com"}];
​
function listaUsuarios() {  
  var html = '';
  $('ul#usuarios')[0].innerHTML = '';
  console.log("a");
  $(data).each(function(i){
    console.log("b");
    html += '<li style="display:inline">'+
                  '<div class="item-inner">'+
                    '<div class="item-media">'+
                      '<i class="icon icon-f7"></i>'+
                    '</div>'+
                    '<div class="item-title">'+this.nome+'</div>'+
                    '<div class="item-after">'+this.email+'</div>'+
                    '</div>'+
                '</li>';        
  });
  $('#usuarios').append(html);          
}
Output

You can jump to the latest bin by adding /latest to your URL

Dismiss x
public
Bin info
anonymouspro
0viewers