title: Changing a links href after click with jQuery
body: <p>I am trying to create a link that when clicked on, switches its href attribute, and then goes to that location.</p>
  
  <p>My html is:</p>
  
  <pre><code>&lt;a href="http://google.com" rel="group" data-wpurl="http://yahoo.com"&gt;&lt;/a&gt;
  </code></pre>
  
  <p>When clicked, I would like the browser to go to the data-wpurl location, not href location. The reason I am using a data attribute is because of the application I am using requires use of the href...not relevant here.</p>
  
  <p>My jQuery is:</p>
  
  <pre><code>$('a[rel="group"]').on('click', function(e) {
        e.preventDefault();
        var wpurl = $(this).attr("data-wpurl");
        $(this).attr('href', wpurl);
  });
  </code></pre>
  
  <p>I am using e.preventDefault(); to prevent the browser from taking the user to the href. After the data attribute is assigned to the href, how do I then trigger a click? Using <code>trigger('click')</code> and <code>click();</code> do not work!</p>
  
  <p>Any ideas?</p>