title: in jQuery Mobile, how to set a data-transition for a group of links?
body: <p>I would like to change the data-transition for all links in specific sections. The docs on jQuery Mobile page transitions (<a href="http://jquerymobile.com/test/docs/pages/docs-transitions.html" rel="nofollow">http://jquerymobile.com/test/docs/pages/docs-transitions.html</a>) only specify how to set a transition type on a per-element basis by using an attribute.</p>
  
  <p>I would prefer to manage interaction behavior entirely in the javascript layer, rather than the content. Setting an option for $.mobile.changePage() for a group of elements would be ideal, but I have not been able to figure out how to do that.</p>
  
  <p>jQuery Mobile docs attribute example:</p>
  
  <pre><code>&lt;a href="index.html" data-transition="pop"&gt;I'll pop&lt;/a&gt;
  </code></pre>
  
  <p>If limited to setting data-transition by an attribute, it would be great if I could specify the transition on a parent element ('flip'):</p>
  
  <pre><code>&lt;ul data-transition="flip"&gt;
      &lt;li&gt;&lt;a href="page1.html"&gt;I'll flip&lt;/a&gt;&lt;/li&gt;
      &lt;li&gt;&lt;a href="page2.html"&gt;I'll flip too&lt;/a&gt;&lt;/li&gt;
      &lt;li&gt;&lt;a href="page3.html"&gt;I'll flip as well&lt;/a&gt;&lt;/li&gt;
  &lt;/ul&gt;
  &lt;a href="another_page.html"&gt;I'll use the default transition (eg slide)&lt;/a&gt;
  </code></pre>
  
  <p>Unfortunately this doesn't seem to be how it works.</p>
  
  <p>Currently my best solution is to add the section-specific data-transition attribute to all links within the appropriate section with javascript, but would prefer to handle this in a more performant manner. jQuery .attr solution:</p>
  
  <pre><code>$(document).ready(function(){
      $('ul a').attr('data-transition', 'flip');
  });
  </code></pre>
  
  <p>Thank you!</p>