Skip to content

Instantly share code, notes, and snippets.

@alexyork
Created September 23, 2011 14:43
Show Gist options
  • Save alexyork/1237529 to your computer and use it in GitHub Desktop.
Save alexyork/1237529 to your computer and use it in GitHub Desktop.
A HTML nesting problem.
// Before:
<script>
$("td .foo input").whatever(); // worked fine
</script>
<html>
<table><!-- "legacy" HTML where <table> is used for layout/columns -->
<tr>
<td>
<!-- a lot more HTML was here -->
<table>
<tr>
<td class="foo">
<input />
</td>
</tr>
</table>
</td>
</tr>
</table>
</html>
// Then we do a big redesign and I remove the <table> which was used for layout
<script>
$("td .foo input").whatever(); // stops working
</script>
<html>
<div>
<!-- a lot more HTML was here -->
<table>
<tr>
<td class="foo">
<input />
</td>
</tr>
</table>
</div>
</html>
// DOH!
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment