Edit in JSFiddle

<div>Neque porro quisquam est qui dolorem ipsum quia dolor sit amet, consectetur,
    adipisci velit..." "There is no one who loves pain itself, who seeks after
    it and wants to have it, simply because it is pain..</div>
<div id="main">
    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque vitae
        ligula ligula. Vestibulum nec urna at ipsum cursus sollicitudin. In id
        elit massa, at bibendum <a href="lesson8.blogspot.com">Lesson8</a> Donec sagittis lacinia vulputate. Quisque
        aliquet orci tempus lacus laoreet quis scelerisque odio accumsan. Maecenas
        vulputate mollis pharetra. Donec ante nulla, fermentum ac rhoncus quis,
        laoreet non lacus. Nulla cursus interdum nisi sit amet semper. Maecenas
        consectetur fringilla felis sed dignissim. Curabitur vestibulum tincidunt
        ipsum, ut bibendum lorem imperdiet vitae. Ut in nunc vitae lorem elementum</p>
    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque vitae
        ligula ligula. Vestibulum nec urna at ipsum cursus sollicitudin. In id
        elit massa,</p>
</div> <span>Maecenas vulputate mollis pharetra. Donec ante nulla, fermentum ac rhoncus quis,
        laoreet non lacus. Nulla cursus interdum nisi sit amet semper. Maecenas consectetur
        fringilla felis sed dignissim. Curabitur vestibulum tincidunt ipsum, ut bibendum
        lorem imperdiet vitae.</span>

.elem {
    border: solid rgb(106, 197, 172) 3px;
    position: relative;
}
.endlabel {
    position: absolute;
    background-color: rgb(106, 197, 172);
    color: rgb(65, 65, 66);
    line-height: 1em;
    padding: 0 3px 3px 0;
    font-size: 1em;
    font-family: Arial;
}
div,span { margin:10px }

 function htmlEntities(str) {
     return String(str).replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/>/g, '&gt;').replace(/"/g, '&quot;');
 }

 $("div").each(function (index) {
     console.log(index + ": " + $(this).text());
     $(this).addClass('elem');

     var spanTag = '<span class="endlabel">';
     var endSpanTag = '</span>'

     var tag = '<' + $(this).prop("tagName").toLowerCase();
     var closeTag = '</' + $(this).prop("tagName").toLowerCase() + '>';

     $.each(this.attributes, function (i, attrib) {
         var name = attrib.name;
         var value = attrib.value;
         tag = tag + ' ' + name + '="' + value + '"';
     });
     tag = tag + '>';

     var startTag = spanTag + htmlEntities(tag) + endSpanTag;
     var endTag = '<span class="endlabel" style="bottom: 0;">' + htmlEntities(closeTag) + endSpanTag;

     $(this).prepend(startTag);
     $(this).append(endTag);
 });