popular um select com ajax+json+php

Bom dia amigos;

Estou quebrando a cabeça numa tarefa que me foi passada ja tem uma semana.

Segue a explicaçao:

Estou listando as cidades, e pretendo listar os bairros de acordo com a cidade selecionada.

Pra isso fiz um arquivo de consulta: getBairros.js

e pra listar os bairros na tela criei um arquivo javascript: functionsBairros.js

Mas o javascript esta errado por que nao me retorna nada, e nao estou sabendo como resolver.
Não consegui entender a logica do negocio, mesmo com o exemplo.

seguindo esse exemplo:
http://www.devmedia.com.br/populando-selects-dinamicamente-com-ajax-json-e-php/27658

Arquivos:
Formulario:
http://pastebin.com/qSgWB46V

Conexao:
http://pastebin.com/4sr8DN7w

ajax:
http://pastebin.com/Ya7jQShH

Fiz a consulta na mao e me retorna isso:
Marquei a cidade = São+paulo;

http://fabianomaximiano.com.br/vista/getBairros.php

Agradeço ajuda, de todos!
Abraços