title: Insert a <li> inside an empty <ul> or to the bottom if <li> exists with jQuery
body: <p>I had a look around and (strangely) couldn't find this being asked before, so apologies if this is a duplicate.</p>
  
  <p>I have an unordered list with the class <code>.attachments</code>, if it has no list items inside of it I want the code to insert the <code>&lt;li&gt;</code> inside of the <code>&lt;ul&gt;</code>, if any <code>&lt;li&gt;</code> exists (regardless of how many) I wish for it to be inserted at the bottom before the <code>&lt;/ul&gt;</code>. How would I go about doing this?</p>
  
  <p>I have the following code, however this would apply it after the <code>&lt;/ul&gt;</code> instead of inside of it.</p>
  
  <pre><code>$("ul.attachments").after('&lt;li&gt;&lt;/li&gt;');
  </code></pre>