Solution 1 :

use class not id for multiple elements.

$( ".msg" ).each(function() {
  var users =  $(this).find(".msg-info-name").text();
  if (users != me) {
    $(this).removeClass("msg right-msg");
    $(this).addClass("msg left-msg");

Problem :

I am making a project of a chat app, I made a code that if the user is not your user it will be in the left side, and if the user is your user it will be on the right side, the code I do works, but there is a single error. The problem is that I do this:


     <div class="msg right-msg" id="side">
      <div class="msg-img" style="background-image: url("></div>

      <div class="msg-bubble">
          <div class="msg-info">
          <div class="msg-info-name">{{ chat.user }}</div>
          <div class="msg-info-time"></div>

          <div class="msg-text">{{ chat.message }}</div>


$( "#side" ).each(function() {
//console.log( index + ": " + $( this ));
var users = $(".msg-info-name").text()

if (users != me) {
  $("#side").removeClass("msg right-msg");
  $("#side").addClass("msg left-msg");

The problem is that there are many of the same html code(That has the same id, class, etc..), So I realized that I can use id in only one, I use id and this was the product Image of the product, it only change the place in the first one, So that doesn´t work.

So I try using class but instead of changing the first one side it change nothing, so class doesn´t works. What can I do?, is another way to loop into all of this, ALSO, the javascript example is using id’s. thank for the help


Comment posted by mr. pc_coder

Do u have more than element whose id same ? If yes don’t make it id is for making unique


Leave a Reply

Your email address will not be published. Required fields are marked *