diff --git a/src/client/app.co b/src/client/app.co
index 821fb70..5693df9 100644
--- a/src/client/app.co
+++ b/src/client/app.co
@@ -298,9 +298,9 @@ const
   $dynamic_mode = $('#dynamic-mode')
   $pl_btn_repeat = $('#pl-btn-repeat')
   $stream_btn = $('#stream-btn')
-  $lib_tabs = $('#lib-tabs')
-  $upload_tab = $('#lib-tabs .upload-tab')
-  $chat_tab = $('#lib-tabs .chat-tab')
+  $tabs = $('#tabs')
+  $upload_tab = $tabs.find('.upload-tab')
+  $chat_tab = $tabs.find('.chat-tab')
   $library = $('#library')
   $lib_filter = $('#lib-filter')
   $track_slider = $('#track-slider')
@@ -317,6 +317,12 @@ const
   $main_err_msg_text = $('#main-err-msg-text')
   $stored_playlists = $('#stored-playlists')
   $upload = $('#upload')
+  $track_display = $('#track-display')
+  $chat_input = $('#chat-input')
+  $chat_name_input = $('#chat-name-input')
+  $chat_pane = $('#chat-pane')
+  $lib_header = $('#library-pane .window-header')
+  $pl_header = $pl_window.find('#playlist .header')
 
 !function saveLocalState
   localStorage.state = JSON.stringify(local_state)
@@ -654,7 +660,7 @@ function getCurrentTrackPosition
     document.title = BASE_TITLE
 
   # set song title
-  $('#track-display').html(track_display)
+  $track_display.html(track_display)
 
   state = mpd.status.state ? "stop"
   # set correct pause/play icon
@@ -678,9 +684,9 @@ function getCurrentTrackPosition
 
 !function render
   hide_main_err = load_status is LoadStatus.GoodToGo
-  $('#playlist-window').toggle(hide_main_err)
-  $('#left-window').toggle(hide_main_err)
-  $('#nowplaying').toggle(hide_main_err)
+  $pl_window.toggle(hide_main_err)
+  $left_window.toggle(hide_main_err)
+  $nowplaying.toggle(hide_main_err)
   $main_err_msg.toggle(not hide_main_err)
   unless hide_main_err
     document.title = BASE_TITLE
@@ -984,7 +990,7 @@ keyboard_handlers = do ->
       shift:   false
       handler: !->
         clickTab 'chat'
-        $('#chat-input').focus().select()
+        $chat_input.focus().select()
     85: # 'u'
       ctrl:    false
       alt:     false
@@ -1027,7 +1033,7 @@ keyboard_handlers = do ->
             close: !-> $('#shortcuts').remove()
         else
           clickTab 'library'
-          $('#lib-filter').focus().select()
+          $lib_filter.focus().select()
 
 !function removeContextMenu
   $('#menu').remove()
@@ -1270,7 +1276,6 @@ function queueSelection (event)
   $playlist_items.on 'mousedown', -> false
 
 !function setUpChatUi
-  $chat_name_input = $('#chat-name-input')
   $chat_user_id_span.on 'click', !(event) ->
     $chat_input.attr "disabled", "disabled"
     chat_name_input_visible := true
@@ -1292,7 +1297,6 @@ function queueSelection (event)
       renderChat()
       return false
 
-  $chat_input = $('#chat-input')
   $chat_input.on 'keydown', (event) ->
     event.stopPropagation()
     if event.which is 27
@@ -1358,9 +1362,9 @@ function queueSelection (event)
   $stream_btn.on 'click', toggleStreamStatus
 
 !function setUpTabsUi
-  $lib_tabs.on 'mouseover', 'li', !(event) ->
+  $tabs.on 'mouseover', 'li', !(event) ->
     $(this).addClass 'ui-state-hover'
-  $lib_tabs.on 'mouseout', 'li', !(event) ->
+  $tabs.on 'mouseout', 'li', !(event) ->
     $(this).removeClass 'ui-state-hover'
 
   tabs = [
@@ -1370,24 +1374,32 @@ function queueSelection (event)
     'chat'
     'settings'
   ]
+  function tabSelector (tab_name)
+    "li.#{tab_name}-tab"
+
+  function $pane (tab_name)
+    $("\##{tab_name}-pane")
+
+  function $tab (tab_name)
+    $tabs.find(tabSelector(tab_name))
 
   !function unselectTabs
-    $lib_tabs.find('li').removeClass 'ui-state-active'
+    $tabs.find('li').removeClass 'ui-state-active'
     for tab of tabs
-      $("\##{tab}-tab").hide()
+      $pane(tab).hide()
 
   clickTab := !(name) ->
     return if name is 'upload' and not server_status?.upload_enabled
     unselectTabs()
-    $lib_tabs.find("li.#{name}-tab").addClass 'ui-state-active'
-    $("\##{name}-tab").show()
+    $tab(name).addClass 'ui-state-active'
+    $pane(name).show()
     handleResize()
     renderChat() if name is 'chat'
 
   for tab of tabs
     let tab
-      $lib_tabs.on 'click', "li.#{tab}-tab", !(event) ->
-        clickTab tab
+      $tabs.on 'click', tabSelector(tab), !(event) ->
+        clickTab(tab)
 
 !function setUpUploadUi
   uploader = new qq.FileUploader do
@@ -1682,17 +1694,15 @@ function queueSelection (event)
   $pl_window.height $left_window.height() - MARGIN
 
   # make the inside containers fit
-  $lib_header = $('#library-tab .window-header')
   $library.height $left_window.height() - $lib_header.position().top - $lib_header.height() - MARGIN
-  tab_contents_height = $left_window.height() - $lib_tabs.height() - MARGIN
+  tab_contents_height = $left_window.height() - $tabs.height() - MARGIN
   $upload.height tab_contents_height
   $stored_playlists.height tab_contents_height
   resizeChat()
-  $pl_header = $pl_window.find('#playlist .header')
   $playlist_items.height $pl_window.height() - $pl_header.position().top - $pl_header.height()
 
 !function resizeChat
-  height_overshoot = $('#chat-tab').height() - $upload.height()
+  height_overshoot = $chat_pane.height() - $upload.height()
   $chat_list.height $chat_list.height() - height_overshoot
 
 !function initStreaming
diff --git a/src/client/styles/app.styl b/src/client/styles/app.styl
index 9e5093f..2223b5c 100644
--- a/src/client/styles/app.styl
+++ b/src/client/styles/app.styl
@@ -85,11 +85,11 @@ body
   width 400px
   position absolute
 
-#library-tab
+#library-pane
   .window-header
     height 30px
 
-#lib-tabs
+#tabs
   user-select none
 
   ul
diff --git a/src/public/index.html b/src/public/index.html
index ad91cb1..90104b2 100644
--- a/src/public/index.html
+++ b/src/public/index.html
@@ -36,7 +36,7 @@
     <div style="clear: both;"></div>
   </div>
   <div id="left-window" style="display: none">
-    <div id="lib-tabs" class="ui-widget ui-corner-all">
+    <div id="tabs" class="ui-widget ui-corner-all">
       <ul class="ui-tabs-nav ui-helper-reset ui-helper-clearfix ui-corner-all">
         <li class="ui-state-default ui-corner-top ui-state-active library-tab"><span>Library</span></li>
         <li class="ui-state-default ui-corner-top stored-playlists-tab"><span>Playlists</span></li>
@@ -45,7 +45,7 @@
         <li class="ui-state-default ui-corner-top settings-tab"><span>Settings</span></li>
       </ul>
     </div>
-    <div id="library-tab" class="ui-widget-content ui-corner-all">
+    <div id="library-pane" class="ui-widget-content ui-corner-all">
       <div class="window-header">
         <input type="text" id="lib-filter" placeholder="filter">
         <select id="organize">
@@ -55,17 +55,17 @@
       <div id="library">
       </div>
     </div>
-    <div id="stored-playlists-tab" class="ui-widget-content ui-corner-all" style="display: none">
+    <div id="stored-playlists-pane" class="ui-widget-content ui-corner-all" style="display: none">
       <div id="stored-playlists">
       </div>
     </div>
-    <div id="upload-tab" class="ui-widget-content ui-corner-all" style="display: none">
+    <div id="upload-pane" class="ui-widget-content ui-corner-all" style="display: none">
       <div id="upload">
         <input id="upload-by-url" type="text" placeholder="Paste URL here">
         <div id="upload-widget"></div>
       </div>
     </div>
-    <div id="chat-tab" class="ui-widget-content ui-corner-all" style="display: none">
+    <div id="chat-pane" class="ui-widget-content ui-corner-all" style="display: none">
       online users:
       <ul id="chat-user-list">
       </ul>
@@ -78,7 +78,7 @@
       <input type="text" id="chat-name-input" placeholder="your name" style="display: none">
       <input type="text" id="chat-input" placeholder="chat">
     </div>
-    <div id="settings-tab" class="ui-widget-content ui-corner-all" style="display: none">
+    <div id="settings-pane" class="ui-widget-content ui-corner-all" style="display: none">
       <div id="settings">
       </div>
     </div>