title: Listitem's li.Value not rendering HTML instead displaying code
body: <p>I am using an admin dashboard on a WebForms ASP.NET C# application, the template caters for notifications which are displayed in a list <code>ul</code>. I've created the notification classes and am able to create and dismiss notifications however displaying them in the pretty format that the template offers is proving to be a headache - I've spent far too much time on such a simple task! The notification data is pulling correctly, I just need to sort out the display. I have to take into consideration that the inner HTML of the <code>li</code> has to store HTML that is dynamically generated based on notification type etc.</p>
  
  <p>Here's the site.master asp code:</p>
  
  <pre><code>&lt;ul class="dropdown-menu"&gt;
      &lt;li&gt;
          &lt;asp:BulletedList ID="notificationList" CssClass="dropdown-menu-list scroller" runat="server" style="height: 250px;" data-handle-color="#637283"&gt;
          &lt;/asp:BulletedList&gt;
      &lt;/li&gt;
  &lt;/ul&gt;
  </code></pre>
  
  <p>Here's the c# code behind it:</p>
  
  <pre><code>string preTime = "&lt; a href = \"javascript:;\" &gt; &lt; span class=\"time\"&gt;";
  string preIcon = "&lt;/span&gt;&lt; span class=\"details\"&gt;";
  string newOfferIcon = "&lt;span class=\"label label-sm label-icon label-success\"&gt;&lt;i class=\"fa fa-plus\"&gt;&lt;/i&gt;&lt;/ span &gt; ";
  string acceptOfferIcon = "&lt;span class=\"label label-sm label-icon label-success\"&gt;&lt;i class=\"fa fa-check\"&gt;&lt;/i&gt;&lt;/ span &gt; ";
  string declineOfferIcon = "&lt;span class=\"label label-sm label-icon label-warning\"&gt;&lt;i class=\"fa fa-times-circle\"&gt;&lt;/i&gt;&lt;/ span &gt; ";
  string postMessage = "&lt;/span&gt;&lt;/ a &gt;";
  foreach (var message in notices)
      {
          ListItem li = new ListItem();
          TimeSpan difference = currentTime - message.notificationDate;
  
          li.Value = preTime + time + preIcon + declineOfferIcon + message.notificationMessage + postMessage;
          notificationList.Items.Add(li); // add the new li element to the notifications list
      }
  </code></pre>
  
  <p>In order to match the template's structure, I am adding links and spans where necessary through concatenation. At the moment it is encoding the HTML in the strings and the output is pure HTML.</p>
  
  <p>I am open to suggestions on restructuring as required, my only requirement is keeping the outputted <code>li</code> elements and HTML structure as below:</p>
  
  <pre><code>&lt;li&gt;
      &lt;a href="javascript:;"&gt;
          &lt;span class="time"&gt;just now&lt;/span&gt; &lt;!-- time string --&gt;
          &lt;span class="details"&gt;
              &lt;span class="label label-sm label-icon label-success"&gt; &lt;!-- this line changes programmatically --&gt;
                  &lt;i class="fa fa-times-circle "&gt;&lt;/i&gt;
              &lt;/span&gt; 
              New user registered. &lt;!-- message string --&gt;
          &lt;/span&gt; 
      &lt;/a&gt;
  &lt;/li&gt;
  </code></pre>