<!doctype html><html lang="en"><head><meta charset="UTF-8"><script src="//ajax.googleapis.com/ajax/libs/angularjs/1.3.0-beta.3/angular.min.js"></script><script src="script.js"></script><link rel="stylesheet" type="text/css" href="styles.css"></head>
<body ng-app="transclusion">
    <div>
    <jp-alert-msg>OMG, I'm talking about Angular at EmberConf!!!!</jp-alert-msg>
  </div>
</body>
</html>
  angular.module('transclusion', [])
    .directive('jpAlertMsg', function() {
      return {
        restrict: 'E',
        transclude: true,
        template: '<div class="alert" ng-transclude></div>'
      };
    });
div.alert{
  background: red;
  padding: 20px;
  color: white;
}