how to apply jquery toogle on click only to the current post, but not to all posts on the page?

Question

I need to show and hide social links on share icon click in the post. Now I have this effect, but when I clicking on the share icon in the post this effect applies to all posts in the posts list on the page, not only on the current post, but I need this effect only in post where this share icon was clicked. How I can make it?

Here my HTML for social links in every post:

        <div class="ml-auto no-gutters text-uppercase post-share-text row align-items-center">
            <span class="share-text">' . __( 'Share:', 'understrap' ) . '</span>
                <ul class="list-inline my-auto ml-auto share-list">
                    <li class="list-inline-item"><a class="share" href="#"><i class="fa fa-facebook-f"></i></a></li>
                    <li class="list-inline-item"><a class="share" href="#"><i class="fa fa-twitter"></i></a></li>
                    <li class="list-inline-item"><a class="share" href="#"><i class="fa fa-google-plus" aria-hidden="true"></i></a></li>
                </ul>
                <i class="my-auto ml-0 fa fa-share-alt"></i>
      </div>

My Jquery:

$(document).ready(function () {

    $('.fa-share-alt').click(function () {
        $('.share-list').toggle("slide");
    });

    $('.fa-share-alt').click(function () {
        $('.share-text').toggle("slide");
    });
});

Answer 1

you can use $(this).parent().find()

$(document).ready(function () {
    $('.fa-share-alt').click(function () {
        $(this).parent().find('.share-list , .share-text').toggle("slide");
    });
});

you can also use .prev() like $(this).prev('.share-list') and $(this).prev().prev('.share-text') but parent().find() is simple to select both elements in just one line of code