# Form embed not rendering on jQuery .after()

**URL:** <https://community.hubspot.com/t/form-embed-not-rendering-on-jquery-after/31264>\
**Category:** CMS Development\
**Tags:** local-development, javascript, forms\
**Created:** [February 4, 2021, 12:39pm UTC](https://community.hubspot.com/t/form-embed-not-rendering-on-jquery-after/31264 "2021-02-04T12:39:10Z")\
**Posts on this page:** 2\
**Page:** 1

<div class="post-metadata">

**Author:** ![benji\_thecroc](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/benji_thecroc/32/31851_2.png) [@benji\_thecroc](https://community.hubspot.com/u/benji_thecroc)\
**Post date:** [February 4, 2021, 12:39pm UTC](https://community.hubspot.com/t/form-embed-not-rendering-on-jquery-after/31264/1 "2021-02-04T12:39:10Z")

</div>

I’m trying to develop a workaround for a site but I’m not sure if it’s viable or not at this point and currently what I have doesn;t seem to be working.

We were hoping to put a form ID’s into href attirbutes within a certain string which would then be used to inject the HubSpot form e.g. (\<a href=“#hs-embed:FORMIDHERE”\>)

The jquery would find these hrefs and take the relevant form ID and inject the embed code after the link. e.g.

```lia-code-sample
$(window).load(function(){
 $('a[href*="#hs-embed"]').each(function() {
 $(this).after('<!--[if lte IE 8]><script charset="utf-8" type="text/javascript" src="//js.hsforms.net/forms/v2-legacy.js"></script><![endif]--><script charset="utf-8" type="text/javascript" src="//js.hsforms.net/forms/v2.js"></script><script>hbspt.forms.create({portalId: "2650439",formId: "' + formID + '",onFormReady: function($form) {console.log("ready");}});</script>');
 });
});

```

The issue I’m having is the form is currnetly not rendering, even if I just palce the ID as is copied from embed code for testing purposes. The onFormReady is outputting the console.log just no form fields are appearing.

---

<div class="post-metadata">

**Author:** ![benji\_thecroc](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/benji_thecroc/32/31851_2.png) [@benji\_thecroc](https://community.hubspot.com/u/benji_thecroc)\
**Post date:** [February 4, 2021, 4:10pm UTC](https://community.hubspot.com/t/form-embed-not-rendering-on-jquery-after/31264/2 "2021-02-04T16:10:44Z")

</div>

Solved it like so

```lia-code-sample
$(window).load(function(){
 $('a[href*="#hs-embed"]').each(function() { 
 let formRef = $(this).attr('href').split('=')[1];
 console.log(formRef);
 $(this).after('<div class="js-form-container" data-formid="' + formRef + '"><div class="inner-wrap"><h4>Speak to a member of our team</h4></div></div>');

 hbspt.forms.create({
 portalId: "PORTAL ID HERE",
 formId: formRef,
 target: '.js-form-container[data-formid="' + formRef + '"] .inner-wrap'
 });

 });
 });

```
