Как повлиять на элемент?

Question

[Messi]

Хочу чтобы в каждом отдельном Wrapper при нажатии Add менялось на Del и наоборот.
У меня с моим кодом, это срабатывает только на первый Wrapper, в остальных не срабатывает. В чем ошибка?
Есть структура:

<div class="wrapper">
	<p class="Add" id="Add1" style="display: block;">Add</p>
	<p class="Del" id="Del1" style="display: none;">Delete</p>
</div>
<div class="wrapper">
	<p class="Add" id="Add2" style="display: block;">Add</p>
	<p class="Del" id="Del2" style="display: none;">Delete</p>
</div>
<div class="wrapper">
	<p class="Add" id="Add3" style="display: block;">Add</p>
	<p class="Del" id="Del3" style="display: none;">Delete</p>
</div>
<div class="wrapper">
	<p class="Add" id="Add4" style="display: block;">Add</p>
	<p class="Del" id="Del4" style="display: none;">Delete</p>
</div>

И код в Jquery:

$(document).ready(function () {

    $('.Add').click(function(event){
        sendPost('/add?id=' + $(this).attr('docId'), function(){
            console.log(window.myAdd);
             $('#'+$('.Del').attr('id')).show();
             $('#'+$('.Add').attr('id')).hide();
        });
    });

    $('.Del').click(function(event){
        sendPost('/del?id=' + $(this).attr('docId'), function(){
			$('#'+$('.Add').attr('id')).show();
            $('#'+$('.Del').attr('id')).hide();
        });
    });


    function sendPost(url, action){
        $.post(url, function (data) {
            if (data.result == true) {
                action();
            }
        });

    }

Answer 1

[developinwed]

Пробуйте

$(document).ready(function () {

    $('.Add').click(function(event){

        _wrapper = $(this).closest('.wrapper');

        sendPost('/add?id=' + $(this).attr('docId'), function(){
            console.log(window.myAdd);
            _wrapper.find('.Add').hide();
            _wrapper.find('.Del').show();
        });
    });

    $('.Del').click(function(event){
        _wrapper = $(this).closest('.wrapper');

        sendPost('/del?id=' + $(this).attr('docId'), function(){
            _wrapper.find('.Add').show();
            _wrapper.find('.Del').hide();
        });
    });


    function sendPost(url, action){
        $.post(url, function (data) {
            if (data.result == true) {
                action();
            }
        });
    }
});