Turn Table into UL list 2
by Ian Roberts
HTML
<table>
<tbody><tr>
<td align="center" class="home enabled firstNavElement selected" id="top_nav_node_page_node_2000018">
<a id="nav_id-page_node_2000018" href="/page/show/2000018-home" title="click to go to 'Home'" class="selected">
Home
</a>
<ul class="dropdown">
<li>
<a href="http://www.indyfueltank.com/tankpoints" class=" disabled " title="click to go to 'Save Now with Tank Points'">
Tank Points
</a>
</li>
</ul>
</td>
<td align="center" class="enabled" id="top_nav_node_page_node_2035560">
<a id="nav_id-page_node_2035560" href="http://www.indyfueltank.com/publicskating" title="click to go to 'Join us for Public Skating'">
Public Skating
</a>
</td>
<td align="center" class="enabled" id="top_nav_node_page_node_2035561">
<a id="nav_id-page_node_2035561" href="http://www.indyfueltank.com/learntoskate" title="click to go to 'Learn to Skate at the Fuel Tank'">
Learn to Skate
</a>
</td>
<td align="center" class="enabled" id="top_nav_node_page_node_2071886">
<a id="nav_id-page_node_2071886" href="http://www.indyfueltank.com/figureskating" title="click to go to 'Figure Skating'">
Figure Skating
</a>
</td>
<td align="center" class="enabled" id="top_nav_node_page_node_2071885">
<a id="nav_id-page_node_2071885" href="http://www.indyfueltank.com/hockey" title="click to go to 'Hockey Programs'">
Hockey
</a>
</td>
<td align="center" class="enabled" id="top_nav_node_page_node_2236385">
<a id="nav_id-page_node_2236385" href="http://www.indyfueltank.com/fuelfitness" title="click to go to 'Fuel Fitness'">
Fuel Fitness
</a>
</td>
<td align="center" class="enabled" id="top_nav_node_page_node_2071898">
<a id="nav_id-page_node_2071898"...
JavaScript
$(document).ready(function() {
function modTable() {
targetTable = $('table');
targetUl = $('<ul>');
targetTable.remove();
navHTML = targetTable.html();
navHTML = navHTML.replace(/<table>/gi, '<ul>');
navHTML = navHTML.replace(/<\/table>/gi, '<\/ul>');
navHTML = navHTML.replace(/<tbody>/gi, '');
navHTML = navHTML.replace(/<\/tbody>/gi, '');
navHTML = navHTML.replace(/<tr>/gi, '');
navHTML = navHTML.replace(/<\/tr>/gi, '');
navHTML = navHTML.replace(/<td/gi, '<li');
navHTML = navHTML.replace(/<\/td>/gi, '<\/li>');
targetUl.append(navHTML);
console.log(targetUl);
$('body').append(targetUl);
}
modTable();
});