javascript - id manipulation in jQuery -

say have unordered list of item1, item2, item3, item4, each div around it.

<ul>   <div><li>item1</li></div>   <div class="current"><li>item2</li></div>   <div><li>item3</li></div>   <div><li>item4</li></div> </ul> 

i want every time click itemx, loads itemx.html , give div around itemx current class attribute. i'm writing 4 functions separately 4 items, , same. how can write general function works on itemx, loads itemx.html , changes div's attribute? current code seems redundant.

assuming you've fixed html problem(li should sub element of ul). still such problem, need do:

$("li").click(function() {     $(".current").removeclass("current");     $(this).parent().addclass("current"); }); 

but correct solution :

html :

<ul>   <li>item1</li>   <li class="current">item2</li>   <li>item3</li>   <li>item4</li> </ul> 

js:

$("li").click(function() {     $(".current").removeclass("current");     $(this).addclass("current"); }); 

and add css li