Colocando seu código dentro desta função irá fazer com que o código rode assim que o DOM esteja pronto no seu site, antes que todo o conteúdo da página seja lida.

E fica a dica, você pode criar quantos você quiser. Ele é a troca pelo famoso/antigo window.onload do JavaScript.

A idéia do tutorial seria uma lista de itens adicionado a um listbox, formando um carrinho de compras dos itens, para depois então enviarmos tudo de uma vez so através do POST do form, gerando uma array para o PHP, é um dos clássicos em programação. Como muita gente não sabe da possibilidade em html/php deixo um tutorial para se ter uma idéia de como utilizar esse recurso.
Sem mais delongas vamos ao código, primeiramente o form, claramente veremos que o nosso listbox na verdade é um selectbox com a tag de multiple (virando assim um listbox):

Agora podemos escrever o código do JQuery com DOM para facilitar nossa vida:

Muito legal né? Mas e para remover ? Bom, para remover eu recomendo dar uma procurada na net sobre um plugin para ListBox usando o JQuery, vocês não querem tudo na mão né? Dúvidas e sugestões é so comentar.

$.ajax( propriedades )
Abre uma página remota utilizando o requeste de HTTP. Pode ser utilizado com envio de POST, GET e leitura de scripts JS e muito mais.

$.ajaxSetup ( propriedades )
Seta todas propriedades GLOBAL do request do ajax.

$.ajaxTimeout( time )
Seta o tempo no qual ocorrerá a espera antes da execução da requisição do ajax.

$.get( url, parametros, retorno da chamada )
Lê uma página remota enviando os dados via GET, mandando URL, parametros são os dados do GET e possibilidade de fazer controle de error no retorno.

$.getJSON( url, parametros, retorno da chamada )
Lê dados JSON utilizando requisição HTTP.

$.getScript( url, retorno da chamada )
Lê e executa um script JavaScript utilizando requisição HTTP GET.

$.post( ? vide outros topicos ?)

ajaxComplete( retorno )
Função que será executada após o ajax ter completado.

ajaxError( retorno )
Função que será executada caso a requisição falhe.

ajaxSend( retorno )
Função que será executada antes da requisição do ajax ser enviado.

ajaxStop( retorno )
Função que será executada após todas requisições ajax terminarem.

ajaxSucess( retorno )
Função que será executada após todas requisições ajax forem bem sucedidas.

load( url, parametros, retorno )
Lê um arquivo HTML e injeta isto ao DOM.

Então estão ae todas ou pelos menos algumas possibilidades que o JQuery lhe da para trabalhar com AJAX, espero que ajude a organizar um pouco as idéias e melhorar na produção, ganhar um pouco em código, pois pelo que eu vi, em vez de usarem os métodos prontos o pessoal tem usado DOM e as vezes retornado problemas diante do I.E.

Se você está perdido aqui e nunca viu nada sobre Jquery, você pode começar com o tutorial original Traduzido.

Para os elementos do Abrir e Fechar do Menu vamos usar somente HTML e complementos de CSS para ficar 'bonito'.

Vamos ao CSS para melhorar o visual:

Essa opção permite que cada sessão possa ser aberta e fechada independente de outras. Esse é o modo mais fácil de fazer o menu de árvore.

O método que iremos usar é .slidetoggle(), é um elemento que escorrega para baixo o menu quando for abrir e escorrega para cima quando for fechar.

Primeiramente vamos esconder todos itens do sub-menu e também vamos conectar cada click para cada h3.

Usamos :eq() que é um seletor que passa por todos DIV e H3, dando HIDE e então criando opção do click.

Então colocaremos o método .slidetoggle() dentro do método click. Como sabemos que cada DIV que queremos mudar a opção para Mostrar/Esconder é a próxima tag de cada H3, podemos usar o metodo .next():

Nesta ultima linha que adicionamos nos dizemos que para o H3 clicado nos referimos o metodo .slidetoggle() para a próxima TAG.

Supersimples não é mesmo? Você pode ver o código de outros modos nesse exemple que eu fiz: Exemplo. Dúvidas? Sugestões? So comentar... abraços

Existem diversas maneiras de se acessar e usar as expressões do JQuery para acessar a div ou tag que você quer mudar um atributo e/ou valor. Vou falar basicamente de acesso por nomes DIV e CLASS, e da XPath que é um modelo fácil de acessar.

Imaginemos que você tenha o seguinte código:

A dúvida fica no ar, como acessar a div viu e o input viu?

Se formos acessar a div ID='viu', podemos simplesmente fazer o seguinte:

Onde então, você viu que para acessar um ID você usa #

Para acessarmos o input ID='viu', pode simplesmente fazer o seguinte:

Ja sei, você sacou a idéia.. hm.... e para acessar uma classe? No nosso caso a classe 'cla'!

Para acessar o id 'naoviu' ?

E para usar XPath ? Que tem a ver? Você pode usar os metodos de XPath para acessar os dados, metodos e atributos também... Maneira mais facil ao meu ver.

Para acessar o input com name = 3, façamos...

Acho que deu para entender um pouco de como funciona as expressões para acesso de valores, atributos e metodos de tudo quanto é TAG xhtml, DIV e outros afins... ehhehee