Javascript 如何在每个帖子的左侧添加固定位置框

您好，我想在分配框左侧的内容方面获得帮助 示例请参见此JS小提琴

但是CSS的内容我应该如何点击它我的意思是我需要像那样保留不同的按钮

简而言之

对于页面左侧的每篇文章，我想显示一个框

请帮我做这个

这看起来怎么样：

HTML:

jQuery：

$('#main').before('<div id="appended" onclick="someFunction()">+</div>');

编辑：

添加了一些HTML来演示多篇文章。稍微更改了CSS，因为我不建议您使用第一个声明捕获两个div。添加了someFunction的实现，以显示其工作原理

---

此处：

不清楚您在问什么……请尝试详细说明或重新措辞！事实上，让我解释一下，我想问的是，我有一个定制的博客，我想在左侧显示日期和其他东西，如社交媒体按钮，如果每个帖子都喜欢顶部的图片。哇，非常感谢：这对我很有帮助：谢谢Alternatex，但有个小问题，我在一个页面上有多个帖子，比如一个博客，所以对于每个页面，都会有不同的ID，我想点击它+，所以针对特定的帖子会采取行动，我们如何实现这一点functionality@nani检查我的最新答案。如果它对你有效，请接受答案，如果你还有更多问题，我建议你开始一个新问题，因为这个问题已经超越了最初的问题。谢谢Alternatex：这很有帮助，谢谢

<div id="main"> </div>

div {
    width: 400px;
    height: 200px;
    background-color:#ccc;
    padding:10px;   
    margin-left:25%;
    color:#000000;
    margin-bottom:8px;
    opacity:0.95;
    filter:alpha(opacity=95); /* For IE8 and earlier */
    -webkit-border-radius: 5px;
       -moz-border-radius: 5px;
        border-radius: 5px;
    position: relative;
}
#appended {
    height: 10px;
    width: 10px;
    text-align: center;
    line-height: 10px;
    background: orange;
    color: #fff; top: 10px;
    border-radius: 0;
    left: -30px;
    position: absolute;
}

$('#main').before('<div id="appended" onclick="someFunction()">+</div>');