JSFiddle - React, Tailwind, and code Playground

by Alan Doe

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.4.2/angular.js"></script>
<div class="content" ng-app="myApp" ng-controller="c">
    <ul id="root">
    </ul>
    <button ng-click="addItem()">ADD </button>
</div>

CSS

.content
{
    width:600px;
    height:600px;
    border:1px solid rgb(240,240,240);
}

#root
{
    width:300px;
    height:300px;
}

.folder
{
    width:80px;
    height:80px;
    background:cyan;
    display:inline-block;
    
    
}

JavaScript

var mod  = angular.module('myApp',[]);

mod.controller('c',function($scope)
               {
           
                   $scope.addItem = function(){
                     
                      var euler = angular.element(document.getElementById('root')); 
                      
                       euler.append('<li class=\"folder\"></li>')
                      
                   };
               
               });