funções em elementos de correr com uma certa classe assim que o DOM é carregado, não usar um manipulador de eventos

Question

Eu tenho uma função simples que eu quero correr em todos os elementos com uma certa classe. Eu quero essa função a ser executada assim que o DOM é carregado; não sobre um manipulador de eventos.

Abaixo está o código que será executado em um manipulador de eventos como hover. Como posso fazê-lo funcionar, assim que o DOM é carregado?

$(document).ready(function(){
    var displayname = $(".displayname");

    function alignSpans(){
        var spanheight = this.offsetHeight;
        var cssbottom = spanheight + "px";
        this.style.bottom = cssbottom; 
    }

    displayname.hover(alignSpans);

});

displayname.alignSpans(); não trabalho

Answer 1

Assumindo displayname é um objeto jQuery, você pode usar .each() para chamar uma função de retorno de chamada usando this como os elementos contidos DOM (o que é muito convenientemente a mesma convenção como um processador de eventos)

displayname.each(alignSpans);

Answer 2

função é isso que o .each () é para. Eu fiz o seu código um pouco mais eficiente também:

$(document).ready(function(){
    $(".displayname").each(function() {
        $(this).css("bottom", $(this).height()); 
    });
});