Unidentified error in Jquery

I was able to solve it, but it was based on the test, I did not understand why it worked, but come on:

The code now:

$(function () {
                $("body").on("click",".voltar", function(){
                    $("#fotos").animate({height: 'toggle'});
                    $("#albuns").animate({height: 'toggle'});
                });  
                $("body").on("click", ".album", function () {
                    $("#albuns").animate({height: 'toggle'});
                    $.ajax({
                        method: 'POST',
                        url: '../codes/album.php',
                        data: {
                            id : $(this).attr('data-id')
                        },
                        success: function (result) {
                            var retorno = JSON.parse(result);
                            $("#fotos").css("display","initial");                            
                            $("#fotos").empty();          
                            var html = "";
                                $(retorno).each(function(key, value) {
                                  html += "\<div class='col-lg-3 col-sm-3 col-md-3 col-xs-6 center'>";
                                  html += "<img class='img' src=" + retorno[key].URL + " /><br />";
                                  html += "<small>" + retorno[key].NOME + "</small>";
                                  html += "\</div\>";
                                  });
                                html += "<a class='btn btn-default voltar'>Voltar</a>";
                                $("#fotos").append(html);
                        } // fim success
                    }); // fim ajax                          
                });
            })

Note that the last error line was like this:

html += "</div>";

I just added a backslash inside the tag:

 html += "</div\>";

And it worked correctly.

If someone understood why, please explain, because although I solved the problem, I want to understand what happened , not to mention that it can help future problems more quickly. It will be useful for me and for anyone who sees this question.

javascript is sensitive to line break, you can not break lines in the middle of a string delimited by quotes, unless you end the line with the \ character, which will ignore the interpretation of the next character, in the if the line break.

Example:

var stringLegal = "Essa\
 string\
 é\
 aceitável";
var stringIlegal = "Essa
 aqui
 não"; //dispara Unexpected Token Illegal

Instead of doing append within loop , do this only once after finishing the loop.

var html = "";
$(retorno).each(function(key, value) {
  html += "<div class='col-lg-3 col-sm-3 col-md-3 col-xs-6 center'>";
  html += "<img class='img' src=" + retorno[key].URL + " /><br />";
  html += "<small>" + retorno[key].NOME + "</small>";
  html += "</div>";
});

html += "<a class='btn btn-default voltar'>Voltar</a>";
$("#fotos").append(html);

Why do this?

• Organization: It is easier for you to read the code, notice that I have separated into lines that "simulate" an indentation.
• Performance: Calling append only once is more efficient.
• And finally, you're sure that your string is error-free.

Well, if it works on a Linux server and on a non-Windows server, the problem is likely to be charset. Try deleting this part of the code and manually re-adding it in a different editor in Windows OS. This happens in many cases because the end of the line in DOS is \r\n while in Unix \n , it may be that in this exchange of servers a line break in Unix mode is added that is not recognized by its editor in Windows, but your browser interprets it.