Can I use jquery inside my custom Polymer elements?

Question

The Polymer documentation says:

Polymer provides a custom API for managing the DOM, so local DOM and light DOM trees are properly supported. These methods and properties have the same signatures as their standard DOM equivalents, except that the properties and methods that return a list of nodes return an Array, not a NodeList.

Note. All DOM manipulations should use this API, and not the DOM API directly on the nodes.

There are many useful methods in jQuery that make my life easier, like toggleClass , hasClass , addClass , one ...

I was able to use some of these methods without consequences in my elements, but I wonder what exactly the semantics are behind the bold part of the above quote, so I can talk about things more clearly.

Note. I'm not talking about using jquery in the main document, I'm talking about using it when I am inside the shadow border, for example, in the callback to the ready element.

Answer 1

You can, really. You just need to use Polymer.dom(this.root).querySelector and wrap the returned element in jquery.

Here is an example. http://jsbin.com/purudu/edit?html,output