Coding table notes

Hello, 
 
I am looking for your thoughts on the best way to code table notes. 
(Table notes here means a table cell has a reference to the note number, the user clicks on the number to jump to the table notes section below the table. i.e. see the "Available Cars" table on the page (http://www.inspection.gc.ca/about-the-cfia/help/site-map/wet-3-0-html-technical-requirements/eng/1426160501826/1426160502764#footnote-table)
 
Here is the code that I propose.  (also wondering if role="note" use is ok in this case)
 
<table>
  <caption class="text-left">Non Available Cars using role=note</caption>
  <thead>
    <tr>
      <th> Car <sup><a href="#fn1" id="fn1-rf">Table Note&nbsp; 1</a></sup></th>
      <th>Color</th>
      <th>Year</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>Ford</td>
      <td>Black</td>
      <td>2000</td>
    </tr>
  </tbody>
</table>
<div role="note">
  <p><strong>Table Notes</strong></p>
  <dl>
    <dt>Table  note 1</dt>
    <dd id="fn1">
      <p>Cars are vehicle that human use.</p>
      <p><a href="#fn1-rf">Return to table note</span>&nbsp;1 referrer</span></a> </p>
    </dd>
    ....
  </dl>
 
Thank you!
Rabab