diff --git a/resources/js/ext.uls.displaysettings.js b/resources/js/ext.uls.displaysettings.js
index 8909a701..302b0b04 100644
--- a/resources/js/ext.uls.displaysettings.js
+++ b/resources/js/ext.uls.displaysettings.js
@@ -17,7 +17,7 @@
  * @licence MIT License
  */
 
-( function( $, mw ) {
+( function( $, mw, window, undefined ) {
 	"use strict";
 
 	var template = '<div class="row"><div class="twelve columns"><h3>Display Settings</h3></div></div>'
@@ -112,6 +112,15 @@
 				languages.push( previousLanguages[lang] );
 			}
 
+			function buttonHandler( button ) {
+				return function () {
+					that.uiLanguage = button.data( "language" ) || that.uiLanguage;
+					$( "div.uls-ui-languages button.button" ).removeClass( "down" );
+					button.addClass( "down" );
+					that.prepareUIFonts();
+				};
+			}
+
 			for ( var i = 0; i < 3; i++ ) {
 				var language = languages[i];
 				var $button = $( '<button>' )
@@ -122,12 +131,7 @@
 				}
 				$button.data( 'language', language );
 				$languages.append( $button );
-				$button.on ( 'click', function () {
-					that.uiLanguage = $( this ).data( "language" ) || that.uiLanguage;
-					$( "div.uls-ui-languages button.button" ).removeClass( "down" );
-					$( this ).addClass( "down" );
-					that.prepareUIFonts();
-				} );
+				$button.on ( 'click', buttonHandler( $button ) );
 			}
 			this.prepareMoreLanguages();
 		},
@@ -190,7 +194,7 @@
 		 */
 		getUILanguage: function () {
 			if ( !window.mw ) {
-				return navigator.language || navigator.userLanguage;
+				return window.navigator.language || window.navigator.userLanguage;
 			}
 			return mw.config.get( 'wgUserLanguage' );
 		},
@@ -277,10 +281,15 @@
 				$uiFontSelector = this.$template.find( "select#ui-font-selector" );
 			// TODO all these repeated selectors can be placed in object constructor.
 
-			this.$template.find( '#uls-displaysettings-apply' ).on( 'click', function () {
+			this.$template.find( 'button#uls-displaysettings-apply' ).on( 'click', function () {
 				that.apply();
 			} );
 
+			this.$template.find( 'button.uls-settings-close' ).on( 'click', function () {
+				// FIXME This should actually go to the previous context than just hiding.
+				that.hide();
+			} );
+
 			this.$template.find( '#webfonts-enable-checkbox' ).on( 'click', function () {
 				if ( this.checked ) {
 					that.webfontPreferences.set( 'webfonts-enabled', true );
@@ -308,6 +317,14 @@
 			} );
 
 		},
+
+		/**
+		 * Hide this window.2
+		 */
+		hide: function () {
+			this.$parent.hide();
+		},
+
 		/**
 		 * Change the language of wiki using setlang URL parameter
 		 * @param {String} language
@@ -356,4 +373,4 @@
 	$.fn.languagesettings.modules = $.extend( $.fn.languagesettings.modules, {
 		display: DisplaySettings
 	} );
-} ) ( jQuery, mediaWiki );
+} ) ( jQuery, mediaWiki, window );
diff --git a/resources/js/ext.uls.languagesettings.js b/resources/js/ext.uls.languagesettings.js
index 47d51593..25b74e33 100644
--- a/resources/js/ext.uls.languagesettings.js
+++ b/resources/js/ext.uls.languagesettings.js
@@ -20,7 +20,7 @@
 ( function( $ ) {
 	"use strict";
 
-	var closeRow = '<div class="row" id="languagesettings-close">' +
+	var closeRow = '<div class="row">' +
 		'<span id="languagesettings-close" class="icon-close"></span>' +
 		'</div>';
 	var settingsMenu = '<div class="four columns languagesettings-menu">' +
@@ -64,8 +64,7 @@
 			var that = this;
 			// Register all event listeners to the ULS language settings here.
 			that.$element.on( "click", $.proxy( that.show, that ) );
-			$( '#languagesettings-close' ).on( "click", $.proxy( that.hide, that ) );
-			$( '.uls-settings-close' ).on( "click", $.proxy( that.hide, that ) );
+			that.$window.find( 'span#languagesettings-close' ).on( "click", $.proxy( that.hide, that ) );
 		},
 
 		render: function() {