Don't show the wrapper from an Angular directive

I have an Angular directive. When I call it on my page, it still shows the outer wrapper. How can I get rid of this wrapper?

directives.js

myApp.directive('myThingy', function(){
  return {
    template: "<div>HELLO!</div>"
  }
});

my_page.html

<html>
  <body>
    <my-thingy></my-thingy>
  </body>
</html>

The DOM in the browser:

<html>
  <body>
    <my-thingy>
      <div>HELLO!</div>
    </my-thingy>
  </body>
</html>

How do I get rid of those <my-thingy> tags, and just show the directive's result?

Desired DOM (there are no my-thingy tags):

<html>
  <body>
    <div>HELLO!</div>
  </body>
</html>

Add option replace

myApp.directive('myThingy', function(){
  return {
    replace: true,
    template: "<div>HELLO!</div>"
  }
});

Example