Как реализовать скрытие и показ элемента?

Question

[Ruslan]

У меня есть код, который создает див(через jquery) элемент(комментарий).



Все работает, удаляет комменты - все ок. Но проблема со сворачиванием. Пытался сделать так:

$('body').on('click', '.task-item__open', function(){
  var cover = $('.task-item__description');
  if(cover.is(':visible')){
    cover.hide(200);
  } else {
    cover.show(200);
  }
})

Но тогда сворачивает все созданные комментарии, попытался сделать подобие кода с удалением:

function coverComment(cover) {
  cover.slideToggle();
}

$('body').on('click', '.task-item__open', function(){
let cover = $(this).parents('.task-item__description');
coverComment(cover);
})

Но так просто ничего не работает. Как это подправить?

Вот код удаления комментария:

$('body').on('click', '.task-item__clear', function(event){
event.preventDefault();
let item = $(this).parents('.task-item');
deleteComment(item);

Comments

[lUser L]

Может это $(this).parents('.task-item__description'); заменить на это $(this).parents('.task-item'); ?
А может и нет. Добавьте разметку к вопросу

[Kovalsky]

Подозреваю, при клике на конкретный таск стоит скрывать конкретный description принадлежащий текущему таску, а не все сразу

[Ruslan]

Kovalsky, да, именно так

[Ruslan]

🔥 Эмиль 👻,
скрывать нужно именно нижнюю часть коммента (.task-item__description), а не всю, как при удалении

[moonbow]

в статье вот что:

$(document).ready(function(){

    //hide message_body after the first one
    $(".message_list .message_body:gt(0)").hide();

    //hide message li after the 5th
    $(".message_list li:gt(4)").hide();

    //toggle message_body
    $(".message_head").click(function(){
        $(this).next(".message_body").slideToggle(500)
        return false;
    });

    //collapse all messages
    $(".collpase_all_message").click(function(){
        $(".message_body").slideUp(500)
        return false;
    });

    //show all messages
    $(".show_all_message").click(function(){
        $(this).hide()
        $(".show_recent_only").show()
        $(".message_list li:gt(4)").slideDown()
        return false;
    });

    //show recent messages only
    $(".show_recent_only").click(function(){
        $(this).hide()
        $(".show_all_message").show()
        $(".message_list li:gt(4)").slideUp()
        return false;
    });

});

Answer 1

[Ruslan]

Просто надо было правильно найти родителя и через него закрывать элемент)