Using jquery .siblings() grabs all outside divs with specified class

Question

I have a main div where I append divs with the class .child_txt whenever the user clicks a certain button.
The new divs come with a button that when is clicked, a window pops up and you can type text inside a textarea and submit to the correspondent div child_txt.

In the first submit it goes to the right div, but then, if you submit a second time, it starts to submit to all .child_txt in the DOM.

How can I make it submit only to the corresponding div where the button .textwas clicked?

Here you have the project in action: JSFIDDLE

HTML

<div class="child_txt" style="left:10px;">
    <div class='text'>T</div>
    <div class="text_container" ></div>
</div>
<div class="child_txt" style="left:220px;">
    <div class='text'>T</div>
    <div class="text_container" ></div>
</div>
<div class="text_edit" style="visibility: hidden; display: none;" >
    <textarea class="jqte-test" id="texto" name="texto" style="display:block; margin:auto; width:98%; "></textarea>
    <button class="text_submit btn" style="margin-top:5px; float:right;">Submit</button>
</div>

CSS

.child_txt{ width: 200px; height: 200px; position: absolute; background-color:rgba(73,145,145,0.7); overflow: hidden; }

.child_txt .text{ width: 14px; height: 14px; position: absolute; top: 3px; right: 0px; font-size: 14px; line-height: 100%; font-weight: bold; color: #005e5e; cursor: pointer;}

.text_container{ display:block; float: left; width: 100%; height: 100%; word-wrap: break-word;}

JQUERY

$('.text').click(function(){
    var clicked = 0;
    var clicked = this;

    $('.text_edit').removeAttr('style');
    $('.text_edit').dialog({ width:300, height:150, maxWidth: 300, maxHeight: 150, minWidth: 300, minHeight: 150 });

    $('.text_submit').click(function(){
             $(clicked).siblings('div.text_container').closest('div.text_container').html($('textarea#texto').val());
        $('.text_edit').dialog( "close" );
    });
});

Answer 1

Every time you click the .text element, you are rebinding the .text_submit handler. There are a lot of different ways of going about solving this. Here's something I hacked together quickly using deferred. There's plenty of room for improvement:

http://jsfiddle.net/e7G6T/

$('.text').click(function () {
    var clicked = this;

    getText().done(function (result) {
        console.log(this);
        $(clicked).siblings('div.text_container').html(result);
    });
});

function getText() {
    var def = $.Deferred();

    $('.text_edit').removeAttr('style');
    $('.text_edit').dialog({
        width: 300,
        height: 150,
        maxWidth: 300,
        maxHeight: 150,
        minWidth: 300,
        minHeight: 150,
        buttons: [{
            text: "Submit",
            click: function () {
                def.resolve($('textarea#texto').val());
                $(this).dialog('close');
            }
        }]
    });

    return def.promise();
}