Reversing a jquery by selecting siblings

Question

This is to customize dokuwiki, I have this code (https://www.dokuwiki.org/tips:clicknshow) that I want to "reverse". So that clicking on a heading will close all other headings, making for a cleaner printjob.

jQuery(function(){
  jQuery('h2,h3,h4,h5,h6').css('cursor','pointer').click(function(){
    var tag=this.tagName, 
        tagIdx=parseInt(tag.match(/\d/)[0],10), 
        clicknshow=jQuery(this).data('clicknshow') || false,
        fname=clicknshow?'show':'hide';

    jQuery(this).data('clicknshow',!clicknshow).nextAll().each(function(){
        var jqNode=jQuery(this);
        if (jqNode.is(':header')){
          var hIdx=parseInt(this.tagName.match(/\d/)[0],10);
          if (hIdx<=tagIdx) { return false; }
          jqNode.data('clicknshow',!clicknshow);
        }
        jqNode[fname]();
    });
  });
});

After a day of trying I need to just realize that I don't know jscript at all, and I need help. You can edit a section of working code here. http://jsfiddle.net/W35ny/

Answer 1

try this one:

$("h3").click(function(){
    $(this).siblings("div").hide();
    $(this).next().show();
});

to your second question this one(show all of them if click again):

$("h3").click(function(){

    if($(this)[0].getAttribute("DivShown")== "true")
    {
        $(this).siblings("div").show();
        $(this)[0].setAttribute("DivShown","false");
    }
    else
    {
        $(this).siblings("div").hide();
        $(this).next().show();
        $(this)[0].setAttribute("DivShown","true");
    }
});

*this code looks pretty awful, just a tricky way to solve this.

this specifically works for the order of your html elements (all <h3> and <div> are brothers and all <div> are text to a <h3>) so you hide all brother <div> then show the next one to the current <h3>

Answer 2

Try this

$(function () {
    $("h3[class^=sectionedit]").css('cursor', 'pointer').click(function () {
        var isVisible = $(this).next(".level3").is(":visible");
        $("h3[class^=sectionedit]").next(".level3").hide();
        (isVisible) ? $(this).next(".level3").hide() : $(this).next(".level3").show();
    });
});

DEMO