title: Open a bootstrap modal from another page
body: <p>I have a list of links that each open their own modal. Each of these modals contents display an html file. Here is a sample;</p>
  
  <pre><code>&lt;div id="how-rtm-works" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"&gt;
    &lt;div class="modal-dialog"&gt;
  &lt;div class="modal-content"&gt;
   &lt;div class="modal-header"&gt;
  &lt;button type="button" class="close" data-dismiss="modal"&gt;&amp;times;&lt;/button&gt;
  &lt;h1 id="myModalLabel"&gt;How Right to Manage works&lt;/h1&gt;
  &lt;/div&gt;
  &lt;div class="modal-body" id="utility_body"&gt;
  &lt;p&gt;One fine body…this is getting replaced with content that comes from passed-in href&lt;/p&gt;
  &lt;/div&gt;
  &lt;div class="modal-footer"&gt;
  &lt;button class="btn" data-dismiss="modal"&gt;Close&lt;/button&gt;
  &lt;/div&gt;
  &lt;/div&gt;
  &lt;/div&gt;
  &lt;/div&gt;
  &lt;li&gt;&lt;a data-target="#how-rtm-works" href="modal-content/how-RTM-works.html" role="button" data-toggle="modal"&gt;How Right to Manage works&lt;/a&gt;&lt;/li&gt;
  </code></pre>
  
  <p>Because there is more than one modal, each has its own ID which is referenced in the data-target. </p>
  
  <p>Can anyone advise me on how I would target these modals from another page, or in my case all pages as these will be linked in the website footer nav.</p>