title: how to store html string in php variable using a foreach loop
body: <p>I'm new to <code>php</code>. This is in relation to wordpress and I'm terribly confused.</p>
  
  <p>Basically, I am passing an array of names from another file (via <code>ajax</code> and <code>json</code>) and into a <code>php</code> function. This function will loop through each name and generate <code>html</code> code to display to the page with an image. I would like to store this <code>html</code>code as a string into a variable to be used in another part of my app (specifically to append it to a post to update in real time, but that's a separate issue). </p>
  
  <p>My <code>ajax</code> response is showing the result I want, just not stored in a string. It is also saying the path to my images can't be found despite the path being correct. It seems like I'm either concatenating something wrong or putting quotes in the wrong place, or something else. I want to store all the <code>html</code> generated in <code>$html_string</code> (which I know won't load my app correctly as I'm displaying the code here, it was just the last thing I've tried so I left it in there). </p>
  
  <p>My code: </p>
  
  <pre><code>&lt;?php
  
  add_action('wp_ajax_nopriv_test_function', 'test_function');
  add_action('wp_ajax_test_function', 'test_function');
  
  function test_function() {
    if ( isset($_POST) ) {
  
          $nameData = $_POST['nameData'];
  
  
          //Strip any double escapes then use json_decode to create an array.
          $nameDecode =  json_decode(str_replace('\\', '', $_POST['nameData']));
  
          // Anything outputted will be returned in the response
          foreach ($nameDecode as $key =&gt; $name) {
          $html_string .=  ?&gt;  &lt;img src="&lt;?php bloginfo('template_directory');?&gt;/images/baseball/team0.jpg"&gt; &lt;p&gt; &lt;?php echo $name  ?&gt; &lt;p /&gt; '
        &lt;?php ' }
          echo json_encode($html_string);
  
          // print_r($html_string);
  
      }
    die();
  }  ?&gt;
  </code></pre>
  
  <p>Current output:</p>
  
  <pre><code>ajax success!           &lt;img src="http://card-store.local/wp-content/themes/card-store-theme/images/baseball/team0.jpg"&gt; &lt;p&gt; Eleanora &lt;p /&gt;
                  &lt;img src="http://card-store.local/wp-content/themes/card-store-theme/images/baseball/team0.jpg"&gt; &lt;p&gt; Eleanora &lt;p /&gt;
                  &lt;img src="http://card-store.local/wp-content/themes/card-store-theme/images/baseball/team0.jpg"&gt; &lt;p&gt; george &lt;p /&gt;
                  &lt;img src="http://card-store.local/wp-content/themes/card-store-theme/images/baseball/team0.jpg"&gt; &lt;p&gt; george &lt;p /&gt;
                  &lt;img src="http://card-store.local/wp-content/themes/card-store-theme/images/baseball/team0.jpg"&gt; &lt;p&gt; george &lt;p /&gt;
        null
  card-store.local/:1 GET http://card-store.local/%22http:/card-store.local/wp-content/themes/card-store-theme/images/baseball/team0.jpg/ 404 (Not Found)
  </code></pre>
  
  <p>Desired output: </p>
  
  <pre><code>$html_string = '&lt;img src="http://card-store.local/wp-content/themes/card-store-theme/images/baseball/team0.jpg"&gt; &lt;p&gt; Eleanora &lt;p /&gt;
                  &lt;img src="http://card-store.local/wp-content/themes/card-store-theme/images/baseball/team0.jpg"&gt; &lt;p&gt; Eleanora &lt;p /&gt;
                  &lt;img src="http://card-store.local/wp-content/themes/card-store-theme/images/baseball/team0.jpg"&gt; &lt;p&gt; george &lt;p /&gt;
                  &lt;img src="http://card-store.local/wp-content/themes/card-store-theme/images/baseball/team0.jpg"&gt; &lt;p&gt; george &lt;p /&gt;
                  &lt;img src="http://card-store.local/wp-content/themes/card-store-theme/images/baseball/team0.jpg"&gt; &lt;p&gt; george &lt;p /&gt;';
  </code></pre>
  
  <p>How can I achieve this?</p>