NPMPQd

index.html

<div class="left">
  <ul>
    <li rel="1">Elma</li>
     <li rel="2">Çilek</li>
     <li rel="3">Armut</li>
     <li rel="4">Kiraz</l4>
     <li rel="5">Vişne </li>
  </ul>
</div>
<div class="right">
  <ul>
     <li rel="4">Kiraz</li>
       <li rel="3">Armut</li>
    <li rel="1">Elma</li>
     <li rel="2"> Çilek</li>
    <li rel="5">Vişne</li>
  </ul>
</div>

NPMPQd.markdown

NPMPQd

A Pen by panstable on CodePen.

License.

script.js

$('li').click(function(){
  var selectedRel=$(this).attr("rel");
  var rightLiList=$(".right ul li");

  $.each( rightLiList, function( key, value ) {
		alert(rightLiList[key].attr("rel"))
	});

})

style.css

.left,.right{
  float:left;
  width:200px;
  border:1px solid #ddd;
}


 ul{margin:0;padding:0;}
 ul li{cursor:pointer;padding:8px;width:100%;background:#f7f7f7;margin-bottom:2px;list-style:none;}
li:hover{background:#ddD;}