jQuery document.ready stops the code

Question

The problem I have right now is that when I put the document.ready code wrapping my script it stopps working. I know I can simply not use it, because I only call the script in the end of my HTML, but I want to know why it is breaking my code. PS: I have already added jQuery Code:

  $(document).ready(function () { $('.clicker').click(function() { if($(this).hasClass('clicker')) { var row_index = $(this).parents('tr').index(); $(this).text('Cancelar'); $(this).attr('class', 'cancelar'); var index = row_index - 2; $(".save:eq("+index+")").css('display', 'inline'); } else { $(this).text('Editar'); $(this).attr('class', 'clicker'); $('.save').css('display', 'none'); } }); }); 

 //In the end of the html file: <script type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-2.2.3.min.js"></script> <script src="/js/scripts.js"></script> 

Answer 1

JQuery should be included at the top of the page.

$ is not defined - You are trying to run Jquery but is is not defined which is breaking your page - your script failing there when you trying to run your document.ready.