Hiding siblings programmatically

I want to make a div in my code expand to the width of the viewport and hide anything else to left or right of it - without altering the code outside my div…

My code is pasted into someone else’s page which creates the siblings of my div.

To see the problem please visit dunfermlinerotary.club - What We Do - R& D Pages - Hello World (the forum won’t let me give you a link)

I can’t alter their page so I’m trying to write JS to identify my code’s ancestor then hide all my ancestor’s siblings.

So far, I can find the ancestor and address all its siblings.

My first question is - is there neater way of hiding the siblings?

So far so good but I can’t change properties like width and display on the siblings, only my ancestor.
So second question is 'how can I make the siblings disappear?

Bear in mind I cant change the code of the host and I can’t foretell what changes might be made by its author. (so I can’t use any of their ids or class names in my code)

I hope this is a challenge and not a well known problem which my searches haven’t found the answer to.

P.S. thanks to @codewright who responded to my earlier post which then got lost.

P.P.S. I’m a very old programmer trying to learn some young peoples tricks

Here’s my code (please excuse all the console.logs) .

<div
    id="Accostart"></div>

<div>
        <script>
            function getancestor(P1)
            {
                console.log( 0,P1 );
                x=P1.parentNode;
                console.log( 1, x );
                y=x.children;
                console.log( 2, y.length );
                if (y.length==1){
                    console.log(3,x);
                    ancestor=getancestor(x);
                    console.log(4,x);
                    }
                console.log(5,x);
                return x;
            }
    
            console.log(26,document.getElementById( "Accostart" ));
            
            ancestor=getancestor(document.getElementById( "Accostart" ).parentNode);
                
            console.log(6,ancestor);
            lg=ancestor.children;
            console.log( 7, lg.length );
            if (lg.length>1)
            {
                
                for ( var i = 0; i < lg.length; i = i + 1 )
                      {
                        
                        console.log(8,i,lg[i],lg[i].style.width,  lg[i].style.display);
                        
                        lg[i].style.width='250px';
                        }
                  }
    </script>
Hello World
    </div>

I’ve edited your code for readability. When you enter a code block into a forum post, please precede it with a separate line of three backticks and follow it with a separate line of three backticks to make it easier to read.

You can also use the “preformatted text” tool in the editor (</>) to add backticks around text.

See this post to find the backtick on your keyboard.
Note: Backticks (`) are not single quotes (').

What userid were you using before? (this userid is the brand new so that’s why I’m asking)

I was BS660. I couldn’t log in and I couldn’t create a new account from the same e- address so I started again with a new e-address

Okay. I think you could contact support if you want that old account back.

Thanks, every day a school day :slightly_smiling_face:

I’ve in dialogue with them for a week or more and we decided to cut our losses.

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.