JQuery ein div-Container und das Blur-Event

Ich wollte doch nur ein <div> auf Kommando einblenden lassen und es ebenso wieder verschwinden lassen, wenn der User den Fokus auf ein anderes Element legt, also z.B. außerhalb des <div> auf den Hintergrund klickt. Dazu nutzte ich folgenden Code:

<p id="languageSelectorContainerText">Click to open</p>
<div id="languageSelectorContainerPopup"></div>

Und das hier ist mein JQuery Javascript

$(document).ready(function(){

	$("#languageSelectorContainerText").click(function(){
		$("#languageSelectorContainerPopup").fadeIn(2000);
		$("#languageSelectorContainerPopup").focus();
	});

	$("#languageSelectorContainerPopup").blur(function(){
		$("#languageSelectorContainerPopup").fadeOut(1000);
	});
});

Klappte nur nicht, denn eigentlich können <div> Elemente keinen Fokus erlangen, es sei denn man gibt ihnen einen „Tabindex“. Also rasch den HTML Quellcode angepasst und Tadaa, plötzlich klappt auch das Ausblenden einwandfrei.

<p id="languageSelectorContainerText">Click to open</p>
<div id="languageSelectorContainerPopup" tabindex="1"></div>

Wer das Ganze noch einmal live sehen möchte, kann sich das Geschribbsel bei JSFiddle ansehen.