Funktionen kombinieren?

[blabla333]

<table><th><span class="change">Titel</span></th></table>
<table><th><input type="text" id="irgendwas"></th></table>

$(':input').on('focusout', function(event) {var anzeigen = "<span class=\"change\">Titel</span>";$(this).parent("th").html(anzeigen);});
$('.change').on('click', function(event) { 	var textfeld = "<input type=\"text\" id=\"irgendwas\">";	$(this).parent("th").html(textfeld);});

Ich möchte, dass bei Klick auf den Titel eine Textbox anstelle des Titels eingeblendet wird. Verlässt man das Textfeld, so wird wieder der Titel angezeigt. Das funktioniert immer für sich alleine, aber nie als Endlos-Version. Warum nicht?
Wenn ich auf den Titel klicke und anschließend aus dem Textfeld gehe, passiert bei letzterem Schritt nichts mehr...

Edit this Fiddle - jsFiddle

 

[CPCoder]

Meinst du eher so etwas?

$('#irgendwas').hide();
$('.change').on('click', function(event) {
    $('#irgendwas').show();
    $('.change').hide();
    $('#irgendwas').focus();
});
$(':input').on('focusout', function(event) { 
    $('.change').show();
    $('#irgendwas').hide();
});

jsFiddle

 

[blabla333]

jQuery.ajax({
    type:"POST",
    datatype: "json",
    url: url,
    data: { wert: wert },
    success: function(data) {
         $(this).hide();
    }
});

Warum funktioniert $(this) nicht innerhalb von "success"? Ich möchte ja, dass wenn der AJAX-Befehl erfolgreich übermittelt wurde dann das aktuelle Element ausgeblendet wird.

 

[scbawik]

Weil this sich hier in einem anderen Kontext befindet. So wärs möglich, ich gehe mal davon aus das ganze ist in einem click-Event:

$('.target').click(function () {
     var target = $(this);
     jQuery.ajax({
          success: function (data) { target.hide(); }
     });
});

 

[blabla333]

Danke. Das macht natürlich Sinn...