JSFiddle - React, Tailwind, and code Playground

HTML

<ul>
  <li id="qtranslate-3" class="widget qtranxs_widget">
    <ul class="language-chooser language-chooser-text qtranxs_language_chooser" id="qtranslate-3-chooser">
      <li class="lang-ru active">
        <a href="" lang="ru" title="Рус (ru)" class="qtranxs_text qtranxs_text_ru"><span>Рус</span></a>
      </li>
      <li class="lang-ua">
        <a href="" lang="ua" title="Рус (ua)" class="qtranxs_text qtranxs_text_ua"><span>Укр</span></a>
      </li>
      <li class="lang-en">
       <a href="" lang="en" title="Eng (en)" class="qtranxs_text qtranxs_text_en"><span>Eng</span></a>
      </li>
    </ul>
    <div class="qtranxs_widget_end"></div>
  </li>
</ul>

CSS

.language-chooser li:not(.active) {
  display: none;
}

JavaScript

$(document).ready(function() {

      $('.language-chooser').on('click', '.active', function(e) {
        $(this).parent('.language-chooser').children('li:not(.active)').toggle();
        e.target.closest('a').preventDefault();
      });


      var allOptions = $('.language-chooser').children('li:not(.active)');
      $('.language-chooser').on('click', 'li:not(.active)', function(e) {

        allOptions.removeClass('selected');
        $(this).addClass('selected');
        $('ul').children('.active').html($(this).html());
        allOptions.toggle();
        e.target.closest('a').preventDefault();
      });



    });