Remove all ul within li except the current li

Question

I have to remove all ul within li except the current li .

<ul>
        <li id="Li0">
            <ul>
                <li><span>Childnode1</span></li></ul>
        </li>
        <li id="Li1">
            <ul>
                <li><span>Childnode2</span></li></ul>
        </li>
        <li id="Li2">
            <ul>
                <li><span>Childnode3</span></li></ul>
        </li>
        <li id="Li3">
            <ul>
                <li><span>Childnode4</span></li></ul>
        </li>
        <li id="Li4">
            <ul>
                <li><span>Childnode5</span></li></ul>
        </li>
        <li id="Li5">
            <ul>
                <li><span>Childnode6</span></li></ul>
        </li>
    </ul>

So If i click on the li with id 'li4' every other li that are previous to this li or next to this li should have there ul to be removed from dom.

I was thinking of using the .not operator in jquery but till now not able to do this.

Answer 1

is that what you are searching for?

  $(function(){
            $('li').click(function(){
                $(this).siblings().children("ul").remove();
            });        
     });

Answer 2

This should help.

$(function () {
    $('ul:first').delegate("li[id^='L']", 'click', function () {
        $("ul:first > li[id!='"+$(this).attr('id')+"'] > ul").remove();
    });        
});​

Demo: http://jsfiddle.net/EJWnn/

Answer 3

Demo: http://jsfiddle.net/wwvBL/

$('li').on('click',function(){
    var obj= $(this);
    id= obj.attr('id');
    obj.parent().find('li:not(#'+id+') > ul').remove();
})

Answer 4

Use siblings to find all other adjacent elements:

$("li").click(function() {
    $(this).siblings().find("ul").remove();
});

You might want to have a more specific selector than "li".