Aiuto simulazione comportamento select personalizzato in jQuery

[sevenjeak]

Ho creato tramite, l'aiuto dei css, dei select personalizzati, con una struttura del genere:

<div id="fake-select">
   Testo dentro il select.
   <div>
      <ul>
         <li>Primo elemento</li>
         <li>Secondo elemento</li>
      </ul>
   </div>
</div>

Grazie al css il div all'interno non è visibile, grazie al jQuery questo appare solo se clicci sul div principale, ora, prima di fare questo, o scritto un pezzo di codice che si esegue al click su ogni elemento della pagina, e chiude i div visibile, i select aperti, nel mio caso, ma tutto questo non funziona, il codice jQuery è questo:

   $(document).ready(function()
   {      
      $(this).click(function()
      {
         var fsl = $("div.fake-select div");
         
         for (var i = 0; i < fsl.length; i++)
         {
            if (fsl.eq(i).is(":visible")) {
               fsl.eq(i).hide();
            }
         }
      });
      
      $("div.fake-select").click(function()
      {
         $(this).children("div").show();
      });
   });

Premetto che le due istruzioni ( $(this).clic() e $("div.fake-select").click() ) funzionano solamente se non sono state dichiarate tutte e due insieme all'interno del codice, non so se mi spiego.

Come potrei risolvere questo problema?