Javascript 单击展开/折叠div可获得多个div

我已经创建了展开/折叠div，当有单个内容

div

时，它可以正常工作。当我有多个展开/折叠div时，如何让它为单个内容div工作

代码如下：

$（文档）.ready（函数（）{
var$divView=$（“.added msg-inner”）；
var innerHeight=$divView.removeClass（“添加的消息内部”）.height（）；
$divView.addClass（'added-msg-inner'）；
$（“.downarrow”）。单击（函数（）{
$（“.added msg inner”）.animate({
高度：（$divView.height（）==75）？内部高度：“75px”）
}, 500);
如果（$（“.added msg inner”）.height（）==75）{
$（'.downarrow>i'）.attr（“类”，“fa角度向上”）；
}
否则{
$（'.downarrow>i'）.attr（“类”，“fa角向下”）；
}
返回false；
});
});
.added-msg2{
填充：3%1%；
浮动：左；
宽度：100%；
框大小：边框框；
字体大小：14px；
颜色：#333333；
位置：相对位置；
背景色：#E0；
}
.添加了味精{
浮动：左；
宽度：100%；
高度：75px；
溢出：隐藏；
边缘底部：15px；
}
.向下箭头{
位置：绝对位置；
右：15px；
底部：-12px；
z指数：1；
宽度：30px；
高度：30px；
线高：30px；
字号：18px；
颜色：#fff；
背景色：#003478；
边界半径：50%；
文本对齐：居中；
字体大小：粗体；
光标：指针；
}

代理用户在上添加的消息

2017年6月24日星期六（上午5:03）

Lorem Ipsum只是印刷和排版行业的虚拟文本。自16世纪以来，Lorem Ipsum一直是行业标准的虚拟文本，当时一位不知名的印刷商拿起一个打印工具，将其拼凑成一本打印样本书。它不仅存活了五个世纪

ABCFileName.pdf

代理用户在上添加的消息

2017年6月24日星期六（上午5:03）

Lorem Ipsum只是印刷和排版行业的虚拟文本。自16世纪以来，Lorem Ipsum一直是行业标准的虚拟文本，当时一位不知名的印刷商拿起一个打印工具，将其拼凑成一本打印样本书。它不仅存活了五个世纪

ABCFileName.pdf

您需要让选择器捕捉与单击的项目属于同一部分的元素。此外，
innerHeight
和
$divView
不再是单一值。我建议将计算出的内部高度存储在相关
$divView
元素的数据属性中：

$(document).ready(function() {
    // Store inner height in a data property:
    $(".added-msg-inner").removeClass("added-msg-inner").each(function () {
        $(this).data({innerHeight: $(this).height() });
    }).addClass('added-msg-inner');

    $(".downarrow").click(function() {
        // Get specific divView and innerHeight related to this down arrow
        var $divView = $(this).siblings(".added-msg-inner");
        var innerHeight = $divView.data("innerHeight");

        $divView.animate({
            height: $divView.height() == 75 ? innerHeight : "75px"
        }, 500);
        $('i', this).attr("class", 
            $divView.height() == 75 ? "fa fa-angle-up"
                                    : "fa fa-angle-down");
        return false;
    });
});