Dynamic ID

by Santosh Thakur

HTML

<ul id="manin">
  <li>This is text one</li>
  <li>This is text one</li>
  <li>This is text one</li>
</ul>

CSS

#id_0 {
  border: 1px solid #ff0;
}

#id_1 {
  border: 1px solid #0ff;
}

#id_2 {
  border: 1px solid #f0f;
}

li {
  padding: 5px;
}

JavaScript

$(document).ready(function() {
  $('#manin li').each(function(i) {
    $(this).click(function() {
      alert('id_' + i)
      $(this).attr('id', 'id_' + i)
    })
  })
});