title: Adding a bullet in a span element ONLY if there is no span element
body: <p>I'm trying to add a bullet to an li with the selected class if there is no span. As of now this is adding a bullet everytime the link is clicked. What is the best way to have this add and remove a bullet instead of keep adding bullets every time there is a click?</p>
  
  <p><strong>HTML</strong></p>
  
  <pre><code>&lt;ul class="files-list"&gt;
      &lt;li class="selected"&gt;
          &lt;span&gt;•&lt;/span&gt;
          "12-0001.hello-world.html"
      &lt;/li&gt;
      &lt;li&gt;12-0002.hello-world.html&lt;/li&gt;
  &lt;/ul&gt;
  </code></pre>
  
  <p><strong>JS</strong></p>
  
  <pre><code>$(this).prepend($('&lt;span /&gt;').html('&amp;bull;')).addClass('selected').siblings().removeClass('selected').find('span').remove();
  </code></pre>