# $ not defined / jQuery not supported?

**URL:** <https://community.hubspot.com/t/not-defined-jquery-not-supported/78889>\
**Category:** CMS Development\
**Tags:** javascript\
**Created:** [April 6, 2023, 10:46pm UTC](https://community.hubspot.com/t/not-defined-jquery-not-supported/78889 "2023-04-06T22:46:25Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![SRalston05](https://avatars.discourse-cdn.com/v4/letter/s/8e8cbc/32.png) [@SRalston05](https://community.hubspot.com/u/SRalston05)\
**Post date:** [April 6, 2023, 10:46pm UTC](https://community.hubspot.com/t/not-defined-jquery-not-supported/78889/1 "2023-04-06T22:46:25Z")

</div>

I don’t know much about Hubspot. I’m trying to modify a form for a customer. I need to use jQuery but when I try something as simple as a $document.ready() log to console I get “Uncaught ReferenceError: $ is not defined” in Chrome DevTools Console. I’ve tried the instructions shown here - [Include jQuery across pages](https://knowledge.hubspot.com/website-pages/include-jquery-across-your-hubspot-pages) - but I’m not finding the same options described in that article.

And is javascript/jQuery availability determined by the type of Hubspot account?

Thanks for any input.

Steve R.

---

<div class="post-metadata">

**Author:** ![Indra](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/indra/32/98381_2.png) [@Indra](https://community.hubspot.com/u/Indra)\
**Post date:** [April 7, 2023, 8:05am UTC](https://community.hubspot.com/t/not-defined-jquery-not-supported/78889/2 "2023-04-07T08:05:11Z")

</div>

Hi @SRalston05 ,

HubSpot stopped supporting the latest jQuery version from the build-in option inside the settings where you can enable it. But when using the build in jQuery, you need to write it in full or wrap it like this.

Wrapper function:

```lia-code-sample
jQuery(function($) {
 var selector = $('.element');
} 

```

Full

`var selector = jQuery('.element'); `

But it’s even better to use vanilla JS so don’t have to rely on jQuery if it get’s disabled.

`var selector = document.querySelector('.element'); `

It’s also good to check the article [**How to upgrade to the latest version of jQuery for extra information**](https://developers.hubspot.com/cms/guides/jquery/upgrade)

---

<div class="post-metadata">

**Author:** ![BarryGrennan](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/barrygrennan/32/97794_2.png) [@BarryGrennan](https://community.hubspot.com/u/BarryGrennan)\
**Post date:** [April 10, 2023, 4:52pm UTC](https://community.hubspot.com/t/not-defined-jquery-not-supported/78889/3 "2023-04-10T16:52:54Z")

</div>

What are you trying to achieve? There may be a better way to achieve it than jQuery.

If you’re trying to modify a Hubspot form $document.ready() won’t work anyway as you need to wait until after the form has loaded using a [Global Form Event](https://developers.hubspot.com/docs/api-reference/latest/marketing/forms/global-form-events) Listener like:

```lia-code-sample
window.addEventListener('message', event => {
 if(event.data.type === 'hsFormCallback' && event.data.eventName === 'onFormReady') {
 // YOUR CODE HERE
 }
});

```

* * *

 ![profile2022a.jpg](https://d2qpr2jzcazej7.cloudfront.net/original/2X/7/7273a34ccfe3489fceebc8a36eca751481b59531.jpeg)

**Barry Grennan**

[Freelance HubSpot CMS Developer](https://www.seoanseo.ca?utm_source=HubSpotCommunity)

[Website](https://www.seoanseo.ca?utm_source=HubSpotCommunity) | [Contact](https://www.seoanseo.ca/#contact?utm_source=HubSpotCommunity) | [LinkedIn](https://www.linkedin.com/in/barrygrennan)

---

<div class="post-metadata">

**Author:** ![SRalston05](https://avatars.discourse-cdn.com/v4/letter/s/8e8cbc/32.png) [@SRalston05](https://community.hubspot.com/u/SRalston05)\
**Post date:** [April 11, 2023, 10:02pm UTC](https://community.hubspot.com/t/not-defined-jquery-not-supported/78889/4 "2023-04-11T22:02:51Z")

</div>

There definitely may be a better way to do what I’m trying to do. I need to add the values of one set of checkboxes, a couple text fields, and a select input into a hidden text area. When the form is submitted, that field, along with some others, gets sent to a remote API. The main act of submitting the form works fine, I just need to get the values I mentioned into the text area, because the text area has a place in the API but the other fields do not.
