JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://code.angularjs.org/1.0.0/angular-1.0.0.min.js"></script>
<div ng-app="myModule">
    <accordion>
        <accordion-tab title="Section 1">
            <p>
                Mauris mauris ante, blandit et, ultrices a, suscipit eget, quam. Integer
                ut neque. Vivamus nisi metus, molestie vel, gravida in, condimentum sit
                amet, nunc. Nam a nibh. Donec suscipit eros. Nam mi. Proin viverra leo ut
                odio. Curabitur malesuada. Vestibulum a velit eu ante scelerisque vulputate.
            </p>
        </accordion-tab>
        <accordion-tab title="Section 2">
            <p>
                Mauris mauris ante, blandit et, ultrices a, suscipit eget, quam. Integer
                ut neque. Vivamus nisi metus, molestie vel, gravida in, condimentum sit
                amet, nunc. Nam a nibh. Donec suscipit eros. Nam mi. Proin viverra leo ut
                odio. Curabitur malesuada. Vestibulum a velit eu ante scelerisque vulputate.
            </p>
        </accordion-tab>
        <accordion-tab title="Section 3">
            <p>
                Mauris mauris ante, blandit et, ultrices a, suscipit eget, quam. Integer
                ut neque. Vivamus nisi metus, molestie vel, gravida in, condimentum sit
                amet, nunc. Nam a nibh. Donec suscipit eros. Nam mi. Proin viverra leo ut
                odio. Curabitur malesuada. Vestibulum a velit eu ante scelerisque vulputate.
            </p>
        </accordion-tab>
        <accordion-tab title="Section 4">
            <p>
                Mauris mauris ante, blandit et, ultrices a, suscipit eget, quam. Integer
                ut neque. Vivamus nisi metus, molestie vel, gravida in, condimentum sit
                amet, nunc. Nam a nibh. Donec suscipit eros. Nam mi. Proin viverra leo ut
                odio. Curabitur malesuada. Vestibulum a velit eu ante scelerisque vulputate.
            </p>
        </accordion-tab>
    </accordion>
</div>

JavaScript

var directivesModule = angular.module('myModule', []);

    directivesModule.directive('accordion', function factory(){
        return {
            priority:0,
            restrict:'E',
            transclude:true,
            replace:true,
            scope: {},            
            template:'<div class="accordion" ng-transclude></div>',
            link: function(scope, iElement, iAttr){
                 iElement.accordion({header: "h3.accordionTitle"});
            }
        };
    });

    directivesModule.directive('accordionTab', function(){
        return {
            priority:1,
            restrict:'E',
            replace:true,
            transclude:true,
            scope:{ title:'@'},
            template:'<div><h3 class="accordionTitle"><a href="#">{{title}}</a></h3>' +
                     '<div ng-transclude></div></div>'
        };
    });