JSFiddle - React, Tailwind, and code Playground

HTML

<div id="accordion">    
    <div class="newsArticle">    
        <div class="newsThumb">
            <img src="http://www.placehold.it/32x32&text=One" /> 
        </div>    
        <div class="newsPostContent">    
            <div class="newsTitleDate">
                <span class="newsTitle">Title</span> <span class="newsDate">Date</span>
                <div class="clear"></div>
            </div>    
            More Link    
        </div>    
    </div>
    <div>the_content</div>
    <div class="newsArticle">    
        <div class="newsThumb">
            <img src="http://www.placehold.it/32x32&text=Two" /> 
        </div>    
        <div class="newsPostContent">    
            <div class="newsTitleDate">
                <span class="newsTitle">Title</span> <span class="newsDate">Date</span>
                <div class="clear"></div>
            </div>    
            More Link    
        </div>    
    </div>
    <div>the_content</div>
    <div class="newsArticle">    
        <div class="newsThumb">
            <img src="http://www.placehold.it/32x32&text=Three" /> 
        </div>    
        <div class="newsPostContent">    
            <div class="newsTitleDate">
                <span class="newsTitle">Title</span> <span class="newsDate">Date</span>
                <div class="clear"></div>
            </div>    
            More Link    
        </div>    
    </div>
    <div>the_content</div>
</div>

CSS

.newsThumb {float: left; margin: 0 5px;}
.newsArticle {margin: 5px 0;}

JavaScript

$(document).ready(function() {
    $("#accordion").accordion({ header: '.newsArticle' });
  });