Как дать slideToggle при клике на пустую область?

Question

[an]

Есть вот такой переключатель языков

<div class="lang">
         <?php $translations = pll_the_languages(array("raw" => 1,));?>
         <div class="curent-lang">
            <?= $translations[pll_current_language()]['name'] ?> <i class="arrowlang fa-solid fa-angle-down"></i>
         </div>
         <div class="list-lang">
            <?php foreach ($translations as $item) : ?>
            <a class="<?= ($item['current_lang']) ? 'disabled' : '' ?>" href="<?= $item['url'] ?>">
            <?= $item['name'] ?>
            </a>
            <?php endforeach; ?>
         </div>
      </div>

при клике на curent-lang у блока list-lang убирается display none, присваивается display block свойством slideToggle
если опять кликнуть по curent-lang, блок опять сворачивается в display none

как сделать что бы сворачивалось не только если кликнуть на curent-lang, но и на пустую область?

вот скрипт

$(function() {
   var langb = $('.curent-lang');
   var langl = $('.list-lang');
 
   langb.click(function() {
   langl.slideToggle('');

});

.list-lang{display:none;}

Спасибо

Comments

[Александр]

an
Как вариант присвоить событие "click" всему документу, а не только элементу .curent-lang.

$(document).click(function(event) {
  var langb = $('.curent-lang');
  var langl = $('.list-lang');
  if (!$(event.target).closest('.curent-lang').length) {
    langl.slideUp('');
  }
});

$('.curent-lang').click(function(event) {
  event.stopPropagation();
  var langl = $('.list-lang');
  langl.slideToggle('');
});