How to set child li attribute based on the parent li attribute using Jquery? <p>I have the menu structure like below,</p> <pre><code>&lt;div class="submenu"&gt; &lt;ul class="treeview"&gt; &lt;li class="submenu" id="menu-item-5592" style="background-image: url('open.gif');"&gt; &lt;a href="/Products/Category/Large-Custom-Water-Features"&gt;Large Custom Water Features&lt;/a&gt; &lt;ul class="sub-menu" rel="open" style="display: block;"&gt; &lt;li class="submenu" &gt; &lt;ul class="submenu" rel="closed" style="disply:none;"&gt; &lt;li&gt;&lt;/li&gt; &lt;li&gt;&lt;/li&gt; &lt;/ul&gt; &lt;/li&gt; &lt;/ul&gt; &lt;/li&gt; &lt;/ul&gt; &lt;/div&gt; </code></pre> <p>In the above menu the whole li has <code>style="background-image: url('open.gif');"</code>. previously it was <code>style="background-image: url('closed.gif');"</code>.</p> <p>the above attribute set when i clicked that link. i need when i click that link the i needt to change display attribute from <code>&lt;ul class="submenu" rel="closed" style="display:none;"&gt;</code> to <code>&lt;ul class="submenu" rel="closed" style="display:block;"&gt;</code></p> <p>how can i do this?</p>