JSFiddle - React, Tailwind, and code Playground

HTML

<div class="temporary-wrapper">
    <div class="content-fragment-content">
        <div class="application-header group  favorite-on "></div>

        <div class="application group  favorite-on ">
            <div class="application-indicator"></div>

            <div class="application-identity">
                <h3 class="group-item-name"><a href="http://aicpacommunity.building-blocks.com/sample_group/default.aspx">Sample Group</a></h3>
            </div>

            <div class="application-actions">
                <div class="navigation-list-header"></div>

                <ul class="navigation-list">
                    <li class="navigation-item favorite-on"><a href="#" data-group-id="3" data-isfavorite="true" class="internal-link favorite-on" title="">Remove this group from bookmarks</a></li>
                </ul>

                <div class="navigation-list-footer"></div>
            </div>
        </div>

        <div class="application-footer group"></div>

        <div class="application-header group  favorite-on "></div>

        <div class="application group  favorite-on ">
            <div class="application-indicator"></div>

            <div class="application-identity">
                <h3 class="group-item-name"><a href="http://aicpacommunity.building-blocks.com/administrators/default.aspx">Administrators</a></h3>
            </div>

            <div class="application-actions">
                <div class="navigation-list-header"></div>

                <ul class="navigation-list">
                    <li class="navigation-item favorite-on"><a href="#" data-group-id="2" data-isfavorite="true" class="internal-link favorite-on" title="">Remove this group from bookmarks</a></li>
                </ul>

                <div class="navigation-list-footer"></div>
            </div>
        </div>

        <div class="application-footer group"></div>
    </div>
</div>

CSS

.temporary-wrapper {
  position: relative;
  top: 20px;    
  }

a {
    color: #3773b0;
    text-decoration: none;
    word-break: break-word;
    }

.layout-content.header-top-content-left-sidebar-right .layout-region.content .top-side-border-only.with-header .content-fragment-content {
    background: url(http://aicpacommunity.building-blocks.com/cfs-file.ashx/__key/themefiles/s-37723686aeaa4d5ab8cf2c1d02471312-files/custom_2D00_border_2D00_bottom.png) bottom left repeat-x;
    margin-top: 20px;
    }

.application-header {
    background-color: #476879;
    height: 9px;
    width: 98%;
    margin-left: auto;
    margin-right: auto;
    display: none;
    }

.application {
    clear: both;
    padding: 15px 10px;
    position: relative;
    overflow: visible;
    min-height: 42px;
    border-top: 1px solid #dee3dd;
    }

.application.first {
    clear: both;
    padding: 15px 10px;
    position: relative;
    overflow: visible;
    min-height: 42px;
    border-top: 0px solid #dee3dd;
    }

    .application .application-indicator {
        width: 40px;
        height: 40px;
        float: left;
        margin-right: 12px;
        }

.application.group .application-indicator span {
    background: url(http://aicpacommunity.building-blocks.com/cfs-file.ashx/__key/themefiles/s-37723686aeaa4d5ab8cf2c1d02471312-files/icon_2D00_group.png) top left no-repeat
    }

.application .application-identity {
    float: left;
    width: 35%;
    }

    .application .application-identity h3 {
        color: #183550;
        margin: 0px;
        font-size: 24px;
        line-height: 40px;
        }

.application .application-actions {
    clear: both;
    height: 0px;
    }

.navigation-list li {
    padding: 5px 0
    }

.application a.favorite-on {
    background: url(http://aicpacommunity.building-blocks.com/cfs-file.ashx/__key/themefiles/s-37723686aeaa4d5ab8cf2c1d02471312-files/icon_2D00_forum_2D00_subscribe_2D00_normal.png) 0 1px no-repeat
    }

.application...

JavaScript

$('.content-fragment-content .application:first').addClass('first');