Get a child class name value of the clicked element

[Mr.M]

Hi DW. I have code:

<div class="lv-item media">
<div class="lv-avatar bgm-purple pull-left">u</div>
<div class="media-body">
<div class="lv-title">dynamically_generated_value</div><!-- I want to get this value -->
<div class="lv-small">Sample text</div>
</div>
</div>

I use the following code to activate the selected list. NB the above is also dynamically generated for simplicity let say we have the above code with a unique lv-title value as it's the user chat id so it unique. And I want when I click this element I want to get that child class by name of the selected item. Here's the code I use to set the active when the user click the element.

var chatheader = document.getElementById("uchatlist");
var lvitem = chatheader.getElementByClassName("lv-item media");
for(var i = 0; i < lvitem.length; i++){
lvitem[i].addEventListener("click", function (){
var lvitemcurrent = document.getElementByClassName("lv-item media active");
lvitemcurrent[0].className = lvitemcurrent[0].className.replace(" active","");
this.className += " active";
// Here is where I want to get the title value of the clicked element. 
});
}

NB the fist code is inside a div with a class uchatlist

What I'm doing is a chat system on the left it has a list of users which is what when you click I want to get its title value so that I will be able to show and hide the messages or chats on the right hand side for the selected user. On the right it's where the end user and chat and see the response messages as well. So I want to show this for each user when the user is being clicked from the left and show its chats on the right.

[Mr.M]

I've solved it out like this

var j = 0;
            var chatheader = document.getElementById("uchatlist");
            var lvitem = chatheader.getElementsByClassName("lv-item media");
            for(var i = 0; i < lvitem.length; i++){
            lvitem[i].addEventListener("click", function() {
            var lvitemcurrent = document.getElementsByClassName("lv-item media active");
            lvitemcurrent[0].className = lvitemcurrent[0].className.replace(" active", "");
            this.className += " active";


var father = this;
var sons = father.children;

var len = sons.length;
var i = 0;

for(i ; i < len ; i++){  
   var child = sons[i];

  if(child.className === "media-body"){
      var xchild = child.children;
      var xle = xchild.length;
      var x = 0;
      if(j == 0 && j < 1){

      for(x; x < xle; x++){
        var vchild = xchild[x];
        if(vchild.className === "lv-title"){

                alert(vchild.innerHTML);
                j++;
        }
      }
      }else{
                j = 0;
            }
  }
  }
            });
            }