I'm using this code for toggle. How to create multiple toggle using this code

Question

$(document).ready(function () {
    $(".slidingDiv").hide();
    $(".show_hide").show();
    $('.show_hide').toggle(function () {
        $(".slidingDiv").slideDown(
            function () {
                $("#plus").text("Hide responses")
            }
        );
    }, function () {
        $(".slidingDiv").slideUp(
            function () {
                $("#plus").text("Show responses")
            }
        );
    });
});

<a href="#">Write a responses</a>
<a href="#" id="plus" class="show_hide">Show responses</a> 
<div class="slidingDiv">Test Here </div>

<a href="#">Write a responses</a>
<a href="#" id="plus" class="show_hide">Show responses</a> 
<div class="slidingDiv">Test Here </div>

Answer 1

Since id must be unique, you need to use class instead:

<a href="#">Write a responses</a>
<a href="#" class="plus show_hide">Show responses</a> 
<div class="slidingDiv">Test Here</div>

<a href="#">Write a responses</a>
<a href="#" class="plus show_hide">Show responses</a> 
<div class="slidingDiv">Test Here</div>

then you can do:

$(document).ready(function () {
    $(".slidingDiv").hide();
    $(".show_hide").show();
    $('.show_hide').toggle(function () {
        $(this).next().slideDown(

        function () {
            $(this).prev().text("Hide responses")
        });
    }, function () {
        $(this).next().slideUp(

        function () {
            $(this).prev().text("Show responses")
        });
    });
});

Fiddle Demo