StackOverflow2013

Note that there are some explanatory texts on larger screens.

plurals

POJavaScript function to 'get element by parent class' and assign
text
Body
copied!<p>My predicament is fairly simple: this function gets the <code>id</code> of 'this' <code><li></code> element based on parent <code>id</code> of <code><ul></code>. It used to work fine but not any more, I will either need to have <code><ul></code> use <code>class</code>es instead of <code>id</code> while still being able to assign <code>id</code> of 'current' to the current element, or change my css.</p> <p><strong>JS</strong> </p> <pre><code>function myFunction(element){ liArray = document.getElementById("leftlist").childNodes; i=0; while(liArray[i]){ liArray[i].id=""; i++; } element.id="current"; // or element.className ? } </code></pre> <p><strong>CSS</strong></p> <pre><code>ul#leftlist {background-color: rgb(205,205,205);} ul#leftlist li#current a{color: rgb(96,176,255); background-color:218,218,218);} ul#leftlist li a{ color: rgb(86,86,86);} #leftlist a:link{color: rgb(86,86,86);background-color: #ddd;} #leftlist a:active{color: rgb(96,176,255); background-color: rgb(218,218,218); } </code></pre> <p><strong>HTML</strong></p> <pre><code><ul id="leftlist"> <li onClick='myFunction(this);'><a href="123" bla bla </a></li> <li onClick='myFunction(this);'> .... etc.</li> </ul> </code></pre> <p>Perhaps I need to change my css. This worked before but now the current <code>id</code> is not being effective as <code>ul#leftlist li a</code> takes priority even when i assign <code>id="current"</code> via JavaScript.</p>

Querying!

Guidance

An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload