Angular directive to have an element toggle another element's display on click

ngtoggle.js

'use strict';

angular.module('myApp').directive(
    'ngToggle',
    function() {
        var factory = {
            restrict: 'A',
            link: function postLink(scope, element, attributes) {
                $(element).on('click', function(event) {
                    event.preventDefault();
                    $('#' + attributes.ngToggle).toggle(0);
                });
            }
        };
        return factory;
    }
);

template.html

<a href="" ng-toggle="panel">Toggle panel</a>
<div id="panel" style="display:none;">My Panel</div>