JSFiddle - React, Tailwind, and code Playground

by Neeraj Yadav

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div ng:app="MyApp">
  <div ng:controller="Ctrl">
    <div class='order'>One <span ng:click='add()'>+</span></div>
    <div class='container'>
      <p>0</p>
    </div>
  </div>
</div>

CSS

p {
  margin: 0;
}

div {
  float: left;
  width: 120px;
}

.order {
  border: grey solid 1px;
}

.container {
  border: blue solid 1px;
}

JavaScript

var app = angular.module("MyApp", []);

app.controller("Ctrl", function($scope){
	var count = 0;
  $scope.add = function(){
  	count++;
    $('.container').append("<p>" + count + "</p>");
    var elem = $(".order");
    var outerHt = elem.outerHeight(true) + Number(16);
    elem.css("height", outerHt);  
  }
});