Append variables on page load

I've been beating my head against the wall trying to get this to work, and I feel like I'm missing something simple.

I have a list of DIVs. Inside each div is a text input. I'm getting the variables from each input, and just want to append it to the end of the div.

Works as expected using a click event, but I want it to append when the page LOADS. :(

Here is my code:

$('.myDiv').cli开发者_StackOverflow社区ck(function (){
    var t = $('input:text', this).val();
    $(this).append(t);
});

How do I get this to append on page ready or load? Thanks!

Just add .click() to the end:

$(function() {
    $('.myDiv').click(function (){
        var t = $('input:text', this).val();
        $(this).append(t);
    }).click();
     //  ^----------invoke the handler on each <div> on page load
});

Or if you meant just on page load, without the handler, use the each()^[docs] method to iterate over the elements, running the code:

$(function() {
    $('.myDiv').each(function (){
        var t = $('input:text', this).val();
        $(this).append(t);
    });
});

Or even a little shorter like this if you're using jQuery 1.4 or later:

$(function() {
    $('.myDiv').append(function (){
        return $('input:text', this).val();
    });
});

You can do:

$(document).ready(functon() {
   $('.myDiv').each(function (){
     var t = $('input:text', this).val();
     $(this).append(t);
   }
});

This should do what you want without the need to simulate a click.

use each ...

$(document).ready(function() { 
    $('.myDiv').each(function (){
        var t = $('input:text', this).val();
        $(this).append(t);
    });
});

use

$(document).load(function...)