var plans = "";
var services = "";

$(function() {
	$('#compareTable').append('<table ><thead><tr class="plan_names"><th>&nbsp;</th></tr><tr class="prices"><td>Monthly price</td></tr><tr class="order"><td>&nbsp;</td></tr></thead><tbody></tbody><tfoot><tr class="prices"><td>Monthly price</td></tr><tr class="order"><td>&nbsp;</td></tr></tfoot></table>');

	$.each(services, function(k, v) {
		$('#compareTable tbody ').append('<tr class="plan_names" data-category="' + k + '"><th class="text-left">' + v['title'] + '</th></tr>');
		$.each(v['features'], function(kk, f) {
			//$('#compareTable tbody [data-category=' + k + ']').after('<tr class="text-left" data-service="' + kk + '"><td>' + f + '</td></tr>');
			$('#compareTable tbody').append('<tr class="text-left" data-service="' + kk + '"><td>' + f + '</td></tr>');
		});
	});


	$.each(plans, function(k, v) {
		$('#compareTable .plan_names').append('<th class="text-center">' + v['name'] + '</th>');
		$.each(v['services'], function (s, val) {
			$('#compareTable tr[data-service=' + s + ']').append('<td class="text-center">' + val + '</td>');
		});
		$('#compareTable .prices').append('<td class="text-center"><span class="price">' + v['prices'] + '</span></td>');
		if (v['stock']) {
			$('#compareTable .order').append('<td class="text-center"><a  href="https://dswshop33265.duoservers.com/hosting-order/?plan=' + v['id'] + '">Order</a></td>');
		} else {
			$('#compareTable .order').append('<td class="text-center"><em>Out of stock</em></td>');
		}
	});
});