javascript - .click() event not executing -

What I want to get is that - when the user clicks on the "read more" link

1. It has been removed
2. it changes to a "Less read" label
3. This new "Read less" link The next element of the parent (readmore_holder
4. "readmore_holder" is displayed;

Then again, return the swap link to "less to read" and readmore_holder , but since I also show alert ()

What is the problem here?

If there are ways to simplify this snippet, Then appreciate it.

Thanks in advance!

Edit: Code from jsFiddle example.

  $ ('. Readmore_holder'); $ ('. Readmore_holder'). (Attached) ('& lt; a href =' javascript: zero (0); "square =" toggle "& gt; Read-much more & lt; / a & gt; '); $ ('. Toggleon') (function () {$ (this) .Parent (). Next (). Enclosed ('& lt; a href =' javascript: zero (0); "class =" toggleoff " & Gt; Read-less & lt; / a & gt; '); $ (this) .Parent (). Next (). FadeIn (); $ (this) .remove ();}); $ ('. Toggleoff') (function () {Warning ('works!');});  

HTML

  & lt; P & gt; Headline is fine & lt; / P & gt; & Lt; P class = "readmore_holder" & gt; Responsive Advertising Mechanics East already worked Pellentesque already different types, now once I came to me once again for inquiries about the attackers, inquiries about Ultrace EU for free online for profits , Fasalas Kaur Maurice, Eustoide UTs, Temporary ID pre-e. & Lt; / P & gt;  

You need to use the method for dynamic content