jQuery Simple Example

HTML

<script src="//www.addressfinder.co.nz/assets/v2/widget.js"></script>
<div id="rstSearch"></div>

CSS

#rstSearch {
	background-color: rgba(255, 255, 255,0.7);
	height:200px;
  width:400px;
  position:absolute; 
	z-index:100;
	left: 20%;
	overflow: hidden;
	font-family: Arial; 
	font-size: 14pt;
  
}

#tblResultsList { 
	background:#CCC;
	border:1px solid #000;
	width:100%;
	height:100%;
}

#tblResultsList td button{
	padding:15px;
	border:1px solid #DDD;
}

JavaScript

var Title="Names of the customers";
var arr = [{"id":1,"name":"Mike"},{"id":2,"name":"Tom"},{"id":3,"name":"Herman"},{"id":4,"name":"Ursula"},{"id":5,"name":"Sam"},{"id":6,"name":"Jenny"},{"id":7,"name":"Helga"},{"id":8,"name":"Nikolas"},{"id":9,"name":"Surgen"},{"id":10,"name":"Jorg"}];
           
	var table = $('<table id="tblResultsList">');
		var tr;
		var td;
		  
		$.each(arr, function(i, item) {
			
			var button = $('<button/>', {
				text: item.name, 
				click: function () { alert("dds") }
			});	
		  i % 3 === 0 && (tr = $('<tr>').appendTo(table));
		
		 tr.append('<td>').prepend(button).end();
		});
		
		$('#rstSearch').append(table);