Problems implementing a jQuery toggle plug-in

I’ve just started trying jQuery for a project and have an odd problem. A simple “toggle” to make lines of text appear/disappear works great. But, for some reason I cannot figure out, the text that triggers it shows up twice on the page. I’ve even tried looking for errors with Firebug and Lint but they say it’s clean. Can someone take a peek at this?

Which is the text that triggers a toggle?

@ralph.m: Painting detail - from the source

@okieman - Remove/Comment this line and it should be ok:

$('#pane').before('<p id="x-toggle">Painting detail:</p>');

Ah yes, thanks centered effect. I must be blind. Good solution, too.

Indeed that did solve the problem. Thank you!

If I may borrow just a few more seconds of your time, I’d like to also try to deal with the issue that always comes up whenever someone in a forum kindly shows me correct code.

Yes, it fixed the problem, but I’m left wondering what was the error in technique that led to the formerly-broken page? If I can learn that, I won’t do it again and I won’t have to be on this forum looking kinda like I don’t know what I’m doing!

Yep, ideally the forums should be a place to learn, so ask away. In this case, it was a very simple problem: there was a line of jQuery code in there that said—“insert <p id="x-toggle">Painting detail</p> before the #pane div”. But there’s no need for that, since that code is already there in the HTML. :slight_smile: