diff --git a/freechat-client/src/html.js b/freechat-client/src/html.js
index 10fc548..15bce49 100644
--- a/freechat-client/src/html.js
+++ b/freechat-client/src/html.js
@@ -1,13 +1,12 @@
 
 /**
- * {String} id | id for the 
- * {Object} attrs | config object with the following valid fields and their types
+ * @param {String} id HTML ID
+ * @param {String} type Base tag type => examples include 'button' 'div'
+ * @param {Object} attrs Config object with the following valid fields and their types
  *
- * NOTE: all these fields are optional
- * {Array<String>} attrs.class | classes to apply to the new node
- * {String} attrs.textContent | Textual content to write
+ * @returns HTMLElement
  */
-exports.new_node = function(id, type, attrs) {
+exports.new_node = function (id, type, attrs) {
 	let node = document.createElement(type)
 	if(id) { node.id = id; }
 
@@ -26,19 +25,28 @@ exports.new_node = function(id, type, attrs) {
  * {String} dom_id | element container for the server list itself
  * */
 exports.build_server_list = function (config, dom_id) {
-	if(!config['servers']) {
-		return;
-	}
+	const channels = require('./channels.js')
+	if(!config['servers']) { return; }
 
 
 	let container = document.getElementById(dom_id)
 
 	for(const server of config['servers']) {
-		let child = html.new_node(server['ip'] || server['url'], 'button', {
+		const id = server['domain'] || server['ip']
+
+		let child = html.new_node(id, 'button', {
 			'classList': ['btn', 'btn-outline-secondary', 'btn-nav-settings'],
 			'textContent': server['name'],
-			'type': 'button'
+			'type': 'button',
+			'onClick': channels.get_channels(id, server['port'])
 		})
+		// Why not jquery? because it doesn't write to the node's attributes itself
+		// for some reason
+		child.addEventListener('click', function() {
+			// NOTE: at some point /invite/<code> will be handled on port
+			channels.get_channels(server['domain'], server['port'])
+		})
+
 		container.appendChild(child)
 	}
 }