Error de referencia: no se puede encontrar la variable: $

Estoy usando jQuery. Esta es mi codificación en mi página principal:

<script type="text/javascript" src="https://stackoverflow.com/questions/21417836/script.js"> 
</script>

y mi script.js es:

$(document).ready(function(){    
     $("#title").click(function () {
        alert("Works!");
    });
});

Mi codificación completa se puede encontrar aquí: http://pastie.org/8676656.

Usando una herramienta en el navegador, encontré un error en mi código javascript:

ReferenceError: Can't find variable: $

en línea:

$(document).ready(function() {

Cualquier ayuda sería apreciada.

Tienes que importar jQuery antes de usarlo:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>
<script type="text/javascript" src="https://stackoverflow.com/questions/21417836/script.js"></script>

Observe que está usando // como protocolo (no http:// o https://), significa: si su archivo .html está en un http:// servidor, obtendrá jQuery de http://ajax.google...y si es en un https:// servidor, lo obtendrá de https://ajax.google....

Nota: Si, mientras desarrolla, abre su archivo HTML en su navegador en lugar de en un servidor, debe especificar el protocolo, como en esta respuesta, de lo contrario no funcionará:

<script src="http://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>

Además, si es posible, debe colocar sus archivos .js en la parte inferior de la página, justo antes de cerrar </body>. Ver más en aquí.

Importa jQuery antes de tu código

<script src="http://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"><script>

Incluir jQuery antes de tu guion

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js></script>

este es un problema de carga de jquery, cargue jquery antes de todo su código y script.

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.0.0/jquery.min.js" ></script>