javascript - Targeting and moving child elements with jquery -
i attempting design template volusion platform e-commerce website. there table loaded on category pages need re-position using script. simple enough if able add unique class table element, volusion platform has locked down inner html of page, allowing me change template header/footer html.
the script needs following:
- check if current page category page.
- target specified table
- append display before #mainform
i have created js fiddle relevant information: http://jsfiddle.net/lno034u8/1/
thanks can provide!
here jsfiddle html:
<div class="content"> <main id="content_area"> <!--table move --><table width="100%" cellspacing="0" cellpadding="0" border="0"> <tr><td>this content should display second, , should colored blue</td></tr> </table><!-- / --> <table width="100%" cellspacing="0" cellpadding="0" border="0"> <tbody> <tr> <td> <table width="100%" cellspacing="0" cellpadding="0" border="0"></table> <table width="100%" cellspacing="0" cellpadding="8" border="0"> <tr><td>this content should display first</td></tr> </table> <!-- move table position --><!-- / --> <form id="mainform"></form> <table width="100%" cellspacing="0" cellpadding="0" border="0"></table> </td> </tr> </tbody> </table> </main> </div>
here alternative:
$(function() { var table_to_move = $("#content_area").find("table").first(); $("#content_area").find("form").before(table_to_move); });
example:http://jsfiddle.net/nr5q1lkz/
Comments
Post a Comment