jQuery issues with element headers

Hello, I am using jQuery to update a plugin element like this

function updateStates(data){
jQuery.each(data, function(index, value){                
           simplemaps[value["state_code"]] = {
                "color": value["color"],
                "description": value["description"],
                "hover_color": value["hover_color"],
                "name": value["name"],
                "state_code": value["state_code"],
                "url": value["url"],


Which works great, though it throws this error when I do something else like click on my header.

Is there a way to resolve this? How can I use jQuery for an element without causing issues?

It’s unclear if you’re including the jQuery library yourself; but if so, you need not. It’s already loaded by Bubble, and a reference to the jQuery object is provided as a property of the context object. Click the show documentation link next to the initialize method in the plugin editor, and you will see…

That’s the jQuery object you should be using.


Hello, I have a line in the beginning using it
function(instance, properties, context) {

It works without any errors if it is on a completely blank page within the app

Where? I see no line using it.

I’m sorry, but I don’t understand your message. I’m not sure what your question is. I explained how to get a valid reference to Bubble’s jQuery object. Again, it’s a property of the context object. In your initial post, you’re referencing jQuery globally.

I use jQuery all the time with no issue at all.

1 Like