Home/ Questions/Q 6377105
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-25T01:49:43+00:00

I got this html code from a book that i’m using to learn jquery

  • 0

I got this html code from a book that i’m using to learn jquery i modified it a little bit

<body>
<h4><i>More</i> Mitch Hedberg Quotes</h4>
<div>
  <input type='submit' id='tmpQuote1' value='View Quote' />
</div>
<div>
  <input type='submit' id='tmpQuote2' value='View Quote' />
</div>
<div>
<p id="paragraph"> some text that will disappear</p>
</div>


$(document).ready(
function() {
$('p').mouseover(
function(){
$(this).replaceWith("<p> the text changed to this text </p>");
}
);

$('input#tmpQuote1').click(
  function($e) {
    $e.preventDefault();

    $(this).replaceWith(
      "<p>\n" +
      "  I would imagine that if you could understand \n" + 
      "  Morse code, a tap dancer would drive you crazy.\n" +
      "</p>\n"
    );
  }
);

$('input#tmpQuote2').click(
  function($e) {
    $e.preventDefault();

    $(this).replaceWith(
      "<p>\n" +
      "  I'd like to get four people who do cart wheels \n" +
      "  very good, and make a cart.\n" +
      "</p>\n"
    );
  }
);

Basically when I hover over the the last paragraph it changes text .
when I click on those two buttons they do change to paragraphs + text.
so far so good. But the problem I’m having is understanding why when I hover over the first & second (newly spawned) paragraphs , the mouseover doesn’t work. Is there a delay in Jquery parser. Or maybe I do not know exactly how $this works.

thanks

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    change .click into .live('click',function(){...}); and you’ll be good. The reason is stated above: Event handlers are only added to content which is already there. If you want to add it to every content you add dynamically, you have to use .live.

    • 0