<p>This is the body with footnotes<sup id="fnref:foo"><a href="#fn:foo" rel="footnote">1</a></sup> 
that have named<sup id="fnref:bar"><a href="#fn:bar" rel="footnote">2</a></sup> markers and 
oddly<sup id="fnref:56"><a href="#fn:56" rel="footnote">3</a></sup>  numbered<sup id="fnref:99"><a href="#fn:99" rel="footnote">4</a></sup> markers.</p>
<div class="footnote">
<hr />
<ol>
<li id="fn:foo">
<p>Footnote marked <code>foo</code>.&#160;<a href="#fnref:foo" rev="footnote" title="Jump back to footnote 1 in the text">&#8617;</a></p>
</li>
<li id="fn:bar">
<p>This one is marked <em>bar</em>.&#160;<a href="#fnref:bar" rev="footnote" title="Jump back to footnote 2 in the text">&#8617;</a></p>
</li>
<li id="fn:56">
<p>A <strong>numbered</strong> footnote.&#160;<a href="#fnref:56" rev="footnote" title="Jump back to footnote 3 in the text">&#8617;</a></p>
</li>
<li id="fn:99">
<p>The last one.&#160;<a href="#fnref:99" rev="footnote" title="Jump back to footnote 4 in the text">&#8617;</a></p>
</li>
</ol>
</div>