Question

I am making tree with the help of jquery in the tree whenever there is more than one child for a particular child i want to gave a toggle effect.it means that there should be a plus icon on click of it tree should expand and minus image should come on click of minus tree should collapse and plus image should come.

how to develop this any working example of tree node will be helpful

In this manner i have used your function

function createSpanImageNode(spnNew) {
    var spnImage = document.createElement("span");
    spnImage.id = spnNew + "_" + "spn1";
    $(spnImage).addClass('SpanPlus');
    spnImage.setAttribute('onclick', 'toogleNode("' + spnImage.id + '")');
    return spnImage;
}

function toogleNode(spnID) {
        debugger;
        var dv = $("#" + spnID).parents("div:first");
        var chkUl = $(dv).find('ul').length;
        if (chkUl > 0) {
            if ($("#" + spnID).hasClass('SpanPlus'))
                $("#" + spnID).removeClass('SpanPlus').addClass('SpanMinus');
            else
                $("#" + spnID).removeClass('SpanMinus').addClass('SpanPlus');
            $(dv).find('ul').animate({ height: 'toggle' });
        }
    }

the two actions that it should perform are
1)remove the class with the span and add the class with minus.
2)it should toggle the ul.

both is not working????

Answer 1

http://api.jquery.com/toggle/