--- a/client.js
+++ b/client.js
@@ -76,16 +76,12 @@ document.addEventListener('DOMContentLoa
             pass_element.disabled = true;
         } else if (status == Strophe.Status.CONNFAIL) {
             console.log('Strophe failed to connect.');
-            connect_button.value = 'connect';
-            jid_element.disabled = false;
-            pass_element.disabled = false;
+            onDisconnected();
         } else if (status == Strophe.Status.DISCONNECTING) {
             console.log('Strophe is disconnecting.');
         } else if (status == Strophe.Status.DISCONNECTED) {
             console.log('Strophe is disconnected.');
-            connect_button.value = 'connect';
-            jid_element.disabled = false;
-            pass_element.disabled = false;
+            onDisconnected();
         } else if (status == Strophe.Status.CONNECTED) {
             console.log('Strophe is connected.');
             onConnected();
@@ -95,8 +91,22 @@ document.addEventListener('DOMContentLoa
     function onConnected()
     {
         connected_div.hidden = false;
+        initRoster(connection);
         initPEP(connection);
         initNickname(connection);
         initAvatar(connection);
     }
+
+    function onDisconnected()
+    {
+        connect_button.value = 'connect';
+        jid_element.disabled = false;
+        pass_element.disabled = false;
+        for (let item of document.getElementById('roster-table')) {
+            item.remove();
+        }
+        for (let item of document.getElementById('pep-table')) {
+            item.remove();
+        }
+    }
 });