I'm trying to incorporate some JQuery TOOLS objects into some of my post, but they don't work. After spending a few hours hacking through the code, I found that something in WordPress is embedding my content inside <p> and </p> tag pairs, which is what is breaking my HTML.
For example
<a id="download_now" title="System tooltip for search engines">Download now</a>
<div class="tooltip">
<img src="http://static.flowplayer.org/img/title/eye.png" alt="Flying screens"
style="float:left;margin:0 15px 20px 0" />
<table>
<tr>
<td class="label">File</td>
<td>flowplayer-3.1.5.zip</td>
</tr>
<tr>
<td class="label">Date</td>
<td>2009-10-24</td>
</tr>
<tr>
<td class="label">Size</td>
<td>112 kB</td>
</tr>
<tr>
<td class="label">OS</td>
<td>all</td>
</tr>
</table>
<a href="/blog/36">New features in 3.1</a>
</div>
<script>
// What is $(document).ready ? See: http://flowplayer.org/tools/using.html#document_ready
$(document).ready(function() {
$("#demo img[title]").tooltip('#demotip');
$("#download_now").tooltip({ effect: 'slide'});
});
</script>
becomes
<p><a id="download_now" title="System tooltip for search engines">Download now</a></p>
<div class="tooltip">
<p> <img src="http://static.flowplayer.org/img/title/eye.png" alt="Flying screens"<br />
style="float:left;margin:0 15px 20px 0" /></p>
<table>
<tr>
<td class="label">File</td>
<td>flowplayer-3.1.5.zip</td>
</tr>
<tr>
<td class="label">Date</td>
<td>2009-10-24</td>
</tr>
<tr>
<td class="label">Size</td>
<td>112 kB</td>
</tr>
<tr>
<td class="label">OS</td>
<td>all</td>
</tr>
</table>
<p> <a href="/blog/36">New features in 3.1</a>
</div>
<p><script>
// What is $(document).ready ? See: http://flowplayer.org/tools/using.html#document_ready</p>
<p>$(document).ready(function() {</p>
<p> $("#demo img[title]").tooltip('#demotip'); </p>
<p>$("#download_now").tooltip({ effect: 'slide'});</p>
<p>});
</script></p>
All of the <p> pairs are killing the code. Can anyone shed some light on how to make this work?
Thanks