How do I make the other accordion elements collapse when I click one?

I've got this jQuery accordion working so that the elements open and close when you click them. But I would like to know how to make an open element close when you click another (closed) one. Since I've used .slideToggle(), I can't really target elements that have .slideDown() activated, can I? Because there is no .slideDown().

<div class="accordion">
                <div class="a-entry">
                    <h3 class="a-clickable">Japan</h3>
                    <div class="a-text">
                        <p>
                            Japan is an island country in East Asia. Located in the Pacific Ocean, it lies to the east of the Sea of Japan, the East China Sea, China, North Korea, South Korea and Russia, stretching from the Sea of Okhotsk in the north to the East China Sea and Taiwan in the south. The kanji that make up Japan's name mean "sun origin", and Japan is often called the "Land of the Rising Sun".
                        </p>
                    </div>
                </div>
                <div class="a-entry">
                    <h3 class="a-clickable">China</h3>
                    <div class="a-text">
                        <p>
                            China is a sovereign state in East Asia. It is the world's most populous country, with a population of over 1.35 billion. The PRC is a one-party state governed by the Communist Party, with its seat of government in the capital city of Beijing.[15]It exercises jurisdiction over 22 provinces; five autonomous regions; four direct-controlled municipalities (Beijing, Tianjin, Shanghai and Chongqing); two mostly self-governing special administrative regions (Hong Kong and Macau); and claims sovereignty over Taiwan.
                        </p>
                    </div>
                </div>
                <div class="a-entry">
                    <h3 class="a-clickable">South Korea</h3>
                    <div class="a-text">
                        <p>
                            and commonly referred to as Korea,[9] is a sovereign state in East Asia, constituting the southern part of the Korean Peninsula.[10] The name Korea is derived from the ancient Kingdom of Goguryeo, also known as Koryŏ. Highly urbanized at 92%,[11] Koreans lead a distinctive urban lifestyle with half of them living in the Seoul Capital Area, the world's second largest city[12] with over 25 million residents[13] and a leading global city[14] with the fourth largest economy,[15] rated in 2016 as the world's most livable megacity and safest city to live in.[16] Highly mountainous, Korea is a popular winter sport destination in Asia, hosting the 2018 Winter Olympics.
                        </p>
                    </div>
                </div>

.accordion {
    width: 50%;
    background-color: #ffffff;
    padding: 0;
    margin: 0;
}

.a-clickable {
    background-color: #999;
    padding: 8px;
    border: 3px solid #777;
    margin: 0;
    cursor: pointer;
}

.a-clickable:hover {

}

.a-text {
    display: none;
    padding: 8px;
    padding-top: 0;
    margin: 0;
}

$('.a-clickable').on('click', function() {
    $(this).siblings().slideToggle(300);
});

Here is the current version in action.

https://jsfiddle.net/x8v4cvca/

You have to target all of the clickable objects and hide them (in this case, slideUp() before toggling the clicked on element.

$('.a-clickable').on('click', function() {
    $('.a-clickable').not(this).siblings().slideUp(200);
    $(this).siblings().slideToggle(200);
});