Desativar e Ativar link

Fala galera.

Preciso de uma ajuda pois não manjo nada nada de javascript e inclusive iniciei um curso pra saber um pouco mais. Porém meu problema é mais urgente e não dá pra esperar.

O problema:

Preciso de um link(tem que ser um link mesmo), que fique desativado (não possa clicar, mas ainda aparecendo). E que ele ative apenas depois que os formulários que eu preencher estiverem preenchidos. Se eu apagar qualquer um, é removido e volta a ser desativado. É preciso que ele reconheça que os campos foram preenchidos. A validação eu vou fazer depois, mas preciso fazer alguma forma que esse link esteja ali, visível e que a pessoa possa clicar nele apenas depois que os campos estiverem preenchidos.

Tentei fazer alguma coisa nesse link, mas como não manjo nada, pesquisei pingado saiu uma bagunça.

https://jsfiddle.net/lucasdalferth/z0zvphxq/

Neste link eu tentei fazer com que uma classe ficasse visível e a outra invisível. Ou seja, enquanto estivesse o campo vazio iria aparecer o spam sem o link, e ao ser preenchido elas inverteriam e apareceria o link e esconderia o spam. Mas não sei fazer o js reconhecer o campo vazio e preenchido. Agradeço a ajuda