title: How to add variables from button to html output in jQuery
body: <p>I am using some jQuery to generate some html, however I want to be able to dynamically populate an id field using a variable from the button I use using on click.</p>
  <p>How do I do this in jQuery? Sorry if this is a basic question but I have started jQuery today.</p>
  <p><strong>In my code I basically want the data-id element in my button to be shown in the span of generated html from the jQuery</strong></p>
  <p>See here my code:</p>
  <pre><code>window.onload = function () {    
              
              jQuery(document).ready() 
              
              jQuery(function(){
                  
                 jQuery( &quot;.add-pe&quot; ).click(function() {
                  
              jQuery(&quot;.values-list&quot;).append('&lt;li&gt;&lt;input type=&quot;hidden&quot; name=&quot;acf[field_61e58083d6d49][]&quot; value=&quot;1016&quot;&gt;&lt;span data-id=&quot;1016&quot; class=&quot;acf-rel-item&quot;&gt;Black t shirt&lt;a href=&quot;#&quot; class=&quot;acf-icon -minus small dark&quot; data-name=&quot;remove_item&quot;&gt;&lt;/a&gt;&lt;/span&gt;&lt;/li&gt;');
  });
              });
          };
  
  </code></pre>
  <pre><code>
  &lt;p&gt;&lt;a class=&quot;add-pe btn btn-secondary btn-sm mt-4&quot; data-id=&quot;&lt;?php echo $post_ID; ?&gt;&quot;&gt;Add to claim&lt;/a&gt;&lt;/p&gt;
  
  
  </code></pre>