<!doctype html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>replace function</title>
  

  <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.3.0-beta.2/angular.min.js"></script>

</head>
<body ng-app="scopes">

	<script>
		angular.module('scopes', [])
			  .controller('Ctrl', function($scope) {
                    $scope.title = "hello";

			  })
			  .directive('myDir', function() {
			    return {
			      restrict: 'E',
            replace: true,
				  template: '<div>{{title}}</div>'
			    };
		  });
	</script>

	<div ng-controller="Ctrl">
		<my-dir><h3>some existing content</h3></my-dir>
	</div>


</body>
</html>