Hi, I have 3 <li> inside the <ul>,everytime i clicked i want to put a class name

Code:
   $(function(){

           $('#li-one').click(function(event){
               event.preventDefault();

               $('#li-one').addClass('colorstyle').closest('li').nextAll('.selected').removeClass();


               $('.content').load('add.php');

           })

        });


$(function(){

           $('#li-two').click(function(event){
               event.preventDefault();

               $('#li-two').addClass('colorstyle').closest('li').nextAll('.selected').removeClass();


               $('.content').load('add.php');

           })

        });

$(function(){

           $('#li-three').click(function(event){
               event.preventDefault();

               $('#li-three').addClass('colorstyle').closest('li').nextAll('.selected').removeClass();


               $('.content').load('add.php');

           })

        });
what i want is that if i am going to click li-two the li-one should remove the class name which is .colorstyle,but my code is not working.

Thank you in advance.