Customizing Text in html based on javascript output
<p>I have a modal dialog box function that is set up with a javascript/jquery script that pops up when a user clicks a button.  I pull data from the button to find out which button.  But the text that pops up is set up in html with a div that calls the script function.</p>

<p>My question is, how do I customize this text based on the data I pull in the script.</p>

<p>Here is the relevant code below to give you an idea of what I'm trying to do:</p>

<p>The script:</p>

<pre><code>&lt;script&gt;
$(function() {
  $( "#dialog-modal" ).dialog({autoOpen: false, height: 250, width: 400, modal: true});

  $( "#opener" ).click(function() {
                       $( "#dialog-modal" ).dialog( "open" );

                       $.get('/like_artist.php', {artist_id : $(this).data('artist_id')}, function(data) {
                             alert("Data Loaded: " + data.artist_id);
                             }, "json");

        });

  });
&lt;/script&gt;
</code></pre>

<p>It is called in this div:</p>

<pre><code>&lt;div id="dialog-modal" title="Basic dialog"&gt;
&lt;p&gt;You have just liked &lt;/p&gt;

&lt;p&gt;This is the default dialog which is useful for displaying information. The dialog window can be moved, resized and closed with the 'x' icon.&lt;/p&gt;
&lt;/div&gt;
</code></pre>

<p>The button a user clicks (one of many with different data-artist_id values):</p>

<pre><code>&lt;div class="button_row"&gt;
                        &lt;button type="button" id="opener" data-artist_id="1"&gt;Play My City&lt;/button&gt;
                    &lt;/div&gt;
</code></pre>

<p>Basically I would like to have the artist_id inform the div to make the text in the dialog box customized for each button.  </p>

<p>Thank you very much for your help!</p>
