title: How to display the HTML output in rows
body: <p>Where I am using the div class, there is a line-break after every if statement and the rows are not in alignment.</p>
  <p>How can I correctly align the php output, so both rows is horizontal aligned.</p>
  <pre><code>function display_selected_variation_custom_field_js(){
          ?&gt;
          &lt;script type=&quot;text/javascript&quot;&gt;
          (function($){
              var a = '.custom_variation-text-field', b = $(a).html();
      
              $('form.cart').on('show_variation', function(event, data) {
                  outputHtml = '';
      
                  if( data.model ) {
                      outputHtml += '&lt;div align=&quot;left&quot;&gt; &lt;span&gt;&lt;strong&gt;&lt;?php _e(&quot;Model&quot;); ?&gt;&lt;strong&gt;: '+data.model+'&lt;span&gt;&lt;/div&gt;';
                  }
                  if( data.wattage ) {
                      outputHtml += '&lt;div align=&quot;center&quot;&gt;&lt;span&gt;&lt;strong&gt;&lt;?php _e(&quot;Wattage&quot;); ?&gt;&lt;strong&gt;: '+data.wattage+'&lt;span&gt;&lt;/div&gt;';
                  }
                  if( data.lumen ) {
                      outputHtml += '&lt;div align=&quot;right&quot;&gt;&lt;span&gt;&lt;strong&gt;&lt;?php _e(&quot;Lumen&quot;); ?&gt;&lt;strong&gt;: '+data.lumen+'&lt;span&gt;&lt;/div&gt;';
                  }
                  if( data.material ) {
                      outputHtml += '&lt;div align=&quot;left&quot;&gt;&lt;span&gt;&lt;strong&gt;&lt;?php _e(&quot;Material&quot;); ?&gt;&lt;strong&gt;: '+data.material+'&lt;span&gt;&lt;/div&gt;';
                  }
                  if( data.dimension ) {
                      outputHtml += '&lt;div align=&quot;center&quot;&gt;&lt;span&gt;&lt;strong&gt;&lt;?php _e(&quot;Dimension&quot;); ?&gt;&lt;strong&gt;: '+data.dimension+'&lt;span&gt;&lt;/div&gt;';
                  }
                  if( data.year ) {
                      outputHtml += '&lt;div align=&quot;right&quot;&gt;&lt;span&gt;&lt;strong&gt;&lt;?php _e(&quot;Year&quot;); ?&gt;&lt;strong&gt;: '+data.year+'&lt;span&gt;&lt;/div&gt;';
                  }
                  if( outputHtml ) {
                      $(a).html(outputHtml);
                  }
              }).on('hide_variation', function(event) {
                  $(a).html(b);
              });
          })(jQuery);
          &lt;/script&gt;
  </code></pre>
  <p>Current Output:</p>
  <p><a href="https://i.stack.imgur.com/jH84M.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/jH84M.png" alt="enter image description here" /></a>
  Expected Output:
  <a href="https://i.stack.imgur.com/9wEnl.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/9wEnl.png" alt="enter image description here" /></a></p>