No sé qué le pasa a mi código, no obtengo el resultado deseado. Alguien que me eche una mano y se lo agradeceré mucho.

Si agrego la clase de fila dentro del ciclo for, recibo todos los mensajes, pero no puede diferenciar quién envió y quién recibió, y cuando agrego la clase fuera del ciclo for, solo recibo un mensaje.

 xhr.onload = function () { var messages = [ { id: 36, message: "hay here", username: null, senderId: 1, receiverId: 9 }, { id: 38, message: "hay there again", username: null, senderId: 1, receiverId: 9 }, { id: 37, message: "yes hay", username: null, senderId: 9, receiverId: 1 }, ]; var rowClass = ""; for (var message = 0; message < messages.length; message++) { if (messages[message].senderId === messages[message].senderId) { rowClass = '<div style="text-align:right">' + '<p style="background-color:lightblue">' + mymessages[message].message + "</p>" + "<div>"; } else { rowClass = '<div style="text-align:left">' + '<p style="background-color:green">'; messages[message].message; "</p>" + "<div>"; } } $(".message").append(rowClass); };