How can i use this if i'm using two class together using jquery? : I have to select two classes but there is one issue if i want to use this just for single class how can i use that? Like given below:-

<!-- begin snippet: js hide: false console: true babel: false -->

<!-- language: lang-js -->

     $('.city-selector ul li, .city-selector-close').click(function () {

    var selectedCity = $(this).text();
    $('.selected-city span').text(selectedCity);
                })


<!-- language: lang-css -->

    .city-selector-close{float:right;}

<!-- language: lang-html -->

    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

    <div class="city-selector-close">X</div>
    <div class="city-selector">
    <ul>
                <li class="active">Gurgaon</li>
                <li>Delhi</li>
                <li>Noida</li>
                <li>Faridabad</li>
            </ul>
            </div>
            
            
            <div class="selected-city"><span>Gurgaon</span></div>
            
            

<!-- end snippet -->

in above example everything working fine like which city i want to select. I'm able to select but there is one issue when i select two class together `.city-selector ul li, .city-selector-close` and i just want to get text of clicked class

Still everything working fine but when i click on close then it will be also working like selected city how to solve this issue with this approach?