title: Open a link in new background tab using javascript / jquery
body: <p>I want the functionality to open all links in a website to a new background tab by default when a user clicks on the link. I have checked all over but none of them provide a solution that works on all browsers. I have referred the following two links to write my code:</p>
  
  <p><a href="https://stackoverflow.com/questions/10812628/open-a-new-tab-in-the-background">Working example in chrome</a></p>
  
  <p><a href="https://stackoverflow.com/questions/827716/emulate-clicking-a-link-with-javascript-that-works-with-ie">Suggested modifications for ie</a> </p>
  
  <p>I have the following code:</p>
  
  <pre><code>&lt;html&gt;
  &lt;head&gt;
  &lt;style type="text/css"&gt;
  .link{ color: #0055ff; cursor: pointer; text-decoration: underline; }
  &lt;/style&gt;
  
  
  &lt;script type="text/javascript" src="jquery.js"&gt;&lt;/script&gt;
  &lt;script type="text/javascript"&gt;
  $(document).ready(function(){
  $(".link").on('click', function(event){
  var $this = $(this);
      var a = document.createElement("a");
  
      a.href = $this.href;
  
  
      if( document.createEvent ) {
          var evObj = document.createEvent('MouseEvents');
          evObj.initMouseEvent("click", true, true, window, 0, 0, 0, 0, 0,
                              true, false, false, true, 1, a);
          a.dispatchEvent( evObj );
  
      } else if( document.createEventObject ) {
          var evObj = document.createEventObject();
          evObj.initMouseEvent("click", true, true, window, 0, 0, 0, 0, 0,
                              true, false, false, true, 1, a);
          a.fireEvent( 'onclick', evObj );
      }
  });
  });
  &lt;/script&gt;
  &lt;/head&gt;
  &lt;body&gt;
  &lt;span class="link" data-href="http://www.google.com"&gt;Go to Google&lt;/span&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>