is there jade plugin that would allow manipulation using jquery styled syntax

Question

So say if i have li elements, and i want to use java script to a) find element with class X then add modify some attribute of it.

I can run usual JavaScript and it'd be doable, but i have no idea of how to get handle of existing elements and manipulate them. Can you refer to element with in jade, preferably like in jquery $('.a').has(..) This is new idea i haven't seen it mentioned anywhere before.

Usually it's server side ( you manually modify elements ) or you send data along template to client where javascript can tackled actual elements.

Answer 1

This code does more or less what i wanted. And it's natively supported. It's called conditional attributes in docs.

You can find more information about it in attribute section.

Only works with latest version of jade.

//- Suppose object passed is this
- var selected='about';
li(class={selected:selected=="home"}) Home
li(class={selected:selected=="blog"}) Blog
li(class={selected:selected=="about"}) About

..Will result in this:

<li>Home</li>
<li>Blog</li>
<li class="selected">About</li>