title: How to find if div with specific id exists in jQuery?
body: <p>I’ve got a function that appends a <code>&lt;div&gt;</code> to an element on click. The function gets the text of the clicked element and assigns it to a variable called <code>name</code>. That variable is then used as the <code>&lt;div&gt;</code> <code>id</code> of the appended element.</p>
  
  <p>I need to see if a <code>&lt;div&gt;</code> <code>id</code> with <code>name</code> already exists before I append the element but I don’t know how to find this.</p>
  
  <p>Here is my code:</p>
  
  <pre><code>$("li.friend").live('click', function() {
    name = $(this).text();
  
    // if-statement checking for existence of &lt;div&gt; should go here
    // If &lt;div&gt; does not exist, then append element
      $("div#chatbar").append("&lt;div class='labels'&gt;&lt;div id='" + name + "' style='display:none;'&gt;&lt;/div&gt;" + name + "&lt;/div&gt;");
  
    // Else
      alert('this record already exists');
  });
  </code></pre>
  
  <p>This seems pretty straightforward but I’m getting the error “<em>Unexpected end of file while searching for class name”</em>. I have no clue what that means.</p>
  
  <pre><code>if (document.getElementById(name)) {
    $("div#" + name).css({bottom: '30px'});
  } else {
    $("div#page-content div#chatbar").append("&lt;div class='labels'&gt;" + name + "&lt;/div&gt;&lt;div id='" + name + "'&gt;&lt;/div&gt;");
  }
  </code></pre>
  
  <p>What’s more is that I want to be able to delete this element if I close it out which should then remove the <code>div id [name]</code> from the document but <code>.remove()</code> does not do this.</p>
  
  <p>Here is the code for that:</p>
  
  <pre><code>$(".mini-close").live('click', function(){
    $(this).parent().remove();
  });
  </code></pre>
  
  <p>I added <code>.mini-close</code> to the append function as a child of <code>.labels</code> so there was a way to close out of the appended <code>&lt;div&gt;</code> if needed. After clicking <code>.mini-close</code> and attempting to click the same name again from <code>li.friends</code> it still finds the <code>div id [name]</code> and returns the first part of my <code>if</code> statement.</p>