Show icon after external link using Font Awesome

fa-icon-external-link.css

a[href^="http://"]:after {
  content: "\f08e";
  font-family: FontAwesome;
  font-weight: normal;
  font-style: normal;
  display: inline-block;
  text-decoration: none;
  padding-left: 3px;
}
/* Strip from links to own domain or with class no_icon */
a[href^="http://own-domain.com"]:after,
a.no_icon:after {
  content:"" !important;
  padding-left: 0;
}

I would also add a[href^="https://"]:after to support https links.
If your website is reachable over the www-subdomain, the icon must be removed for this domain too.

I was looking for ideas on adding fa ext links, and found this useful. Thanks for sharing. However, I recon it's better to use jQuery (like below) to select http(s) external links and add a CSS class to them, and then just style the added class. That will make all of these concerns about domain and https needless:

<script>
        $(document).ready(function() {
            $('a[href^="http://"],a[href^="https://"]')
                .attr('target','_blank')
                .addClass('ext_link')
            ;
        });
</script>

Then we style the CSS class:

.ext_link:after {
  content: "\f08e";
  font-family: FontAwesome;
  font-weight: normal;
  font-style: normal;
  display: inline-block;
  text-decoration: none;
  padding-left: 3px;
}

Caveat: In case we want avoid selecting certain domains in the selector, we add additional inequality selectors .. and if we are trying to exclude many domains, then the use of an array to define the domains and a jquery selector filter may become essential .. the general idea, being to take the logic of conditional selection out of CSS, to JS or jQuery where it should belong

@laymonk,
I tryed your script and it works fine!

Could you please give me an example how to exclide the own domain?
Thank you!