jquery problem with .live, .mouseover and .replaceWith / .html

$("body *").live('mouseover', function() {
    var currentId = $(thi开发者_JAVA百科s).attr('id');
    var html = "<div id='perfect' style='font-size:10px;'><div id='pos1'><br>ID: " +currentId+ " <br>Klasse: " +currentClass+ " </div><div id='pos' style='width:300px'></div></div>";
    $("#perfect4").replaceWith(html);
});

that doesnt work why

With the selector "body *" you are target all children of body. I think you would just try this (removing perfect4):

$("body").bind('mouseover', function(e) {
    var domTarget = e.target; // e.target grabs the node that triggered the event.
    var currentId = domTarget.id;
    var sHtml = "<div id='perfect' style='font-size:10px;'><div id='pos1'><br>ID: " +currentId+ " <br>Klasse: " +currentClass+ " </div><div id='pos' style='width:300px'></div></div>";
    var jPerfect = $("#perfect4");
    jPerfect.after(sHtml );
    jPerfect.remove();
});

replacing innerHTML in perfect4:

$("body").bind('mouseover', function(e) {
    var domTarget = e.target; // e.target grabs the node that triggered the event.
    var currentId = domTarget.id;
    var sHtml = "<div id='perfect' style='font-size:10px;'><div id='pos1'><br>ID: " +currentId+ " <br>Klasse: " +currentClass+ " </div><div id='pos' style='width:300px'></div></div>";
    $("#perfect4").html(sHtml);
});

you can use this :

$("#perfect4").text(html);

or

$("#perfect4").val(html);

or

$("#perfect4").html(html);