Манипулирование добавленным элементом в jQuery

[Alexd]

Начал не давно изучение jQuery и сразу столкнулся вот с такой проблемой. Почему с только что добавленным элементом нельзя производить манипуляции, например заменить его так же как <div>Первый Div</div> в приведенном примере. И хотелось бы узнать как это делается правильно.

<div>Первый Div</div>
<button>Создать</button>
<script type="text/javascript">
$(document).ready(function(){
  $("button").click(function() {
    $("body").append("<div>Еще один Div</div>");
  });
  $("div").click(function() {
    $(this).replaceWith("<div>Заменен</div>");
  });
});
</script>

[walik]

Потому что вы обработчик вешаете после загрузки страницы, когда второго ДИВа еще не существует.
Так работает:

<div>Первый Div</div>
<button>Создать</button>
<script type="text/javascript">
$(document).ready(function(){
  $("button").click(function() {
    $("body").append("<div>Еще один Div</div>");
    $("div").click(function() {
       $(this).replaceWith("<div>Заменен</div>");
    });
  });
});
</script>

[Alexd]

Спасибо за ответ, более менее разобрался. Непонятно остается только одно, - почему <div>Первый Div</div>, можно заменить только тогда, когда будет добавлен <div>Еще один Div</div>

[walik]

Так потому что теперь уже событие вешается после добавления)))
Вешайте событие при загрузки страницы, и при добавление элемента вешайте ему тоже событие, вот так:

<div>Первый Div</div>
<button>Создать</button>
<script type="text/javascript">
$(document).ready(function(){
  $("button").click(function() {
    $("<div>Еще один Div</div>").appendTo("body")click(function() {
       $(this).replaceWith("<div>Заменен</div>");
    });
  });
  $("div").click(function() {
     $(this).replaceWith("<div>Заменен</div>");
  });
});
</script>

Хех, забыл, в JQuery есть такое как live()
Так вроде должно работать:

<div>Первый Div</div>
<button>Создать</button>
<script type="text/javascript">
$(document).ready(function(){
  $("button").click(function() {
    $("body").append("<div>Еще один Div</div>");
  });
  $("div").live('click', function() {
    $(this).replaceWith("<div>Заменен</div>");
  });
});
</script>

[Alexd]

Еще раз спасибо, все вопросы для меня теперь решены. Понимаю что мне еще многому надо учиться в javascript, но благодаря таким полезным и содержательным ответам, время на изучение сократится в разы.