title: Dynamically change the background-color of a dynamically created div using Jquery
body: <p>I have two sets of functions, <strong>one which changes the background-color of a div</strong> (a dynamically created div or one that already exists) <strong>and a second that adds new divs inside of divs</strong> which have the class="divplace". </p>
  
  <p>The click events work like this: 
  1) Click the "button" with ID="background_color_button", and then on the div you want to change the background color to. 
  <strong>or</strong> 
  2) Click the "button" with ID="clicker" to add a div inside of a div.</p>
  
  <p>Here is the first: </p>
  
  <pre><code>var $currentInput = null;
  
  $("#background_color_button").live("click", function() {
      $currentInput = null;
      if ($currentInput == null) {
          $currentInput = $(this).prev();
          $("label").html($currentInput.attr("id"));
      }
  });
  
  
  var editid;
  $("div.editable").live("click",function(e) {
      e.stopPropagation();
      if ($currentInput == null)
          return;      
      var css = GetCssProperties();    
      $(this).css(css);
      $("label").html("");
  });
  
  function GetCssProperties() {
      if ($currentInput == null) return null;
  
      var value = $currentInput.val();
  
      if ($currentInput.attr("id") == "background-color") {
          return {
          "background-color": value
          }
      }
  }
  </code></pre>
  
  <p>And here is the second:</p>
  
  <pre><code>var $currentDiv = null;
  $("#clicker").live("click", function() {
      $currentDiv = null;
      if ($currentDiv == null) {
          $currentDiv = $(this).prev();
          $("label").html($currentDiv.attr("id"));
      }
  });
  
  
  var editid;
  $(".divplace").live("click",function(e) {
      e.stopPropagation();
      if ($currentDiv == null)
          return;      
      var newdiv = "&lt;div class='editable divplace'&gt;The Div created inside of this div needs to be able to change the BG color without adding a new div&lt;/div&gt;";   
      $(this).append(newdiv);
      $("label").html("");
  });
  </code></pre>
  
  <p>Here is the JSFiddle document: </p>
  
  <p><a href="http://jsfiddle.net/TSM_mac/QYAB9/" rel="nofollow">http://jsfiddle.net/TSM_mac/QYAB9/</a></p>
  
  <p><strong>My problem is that once you create a Div inside of a Div (With class="divplace") inside of a Div, you cannot change the color of that created Div without adding a new Div. I want to be able to create a limitless amount of Divs inside of Divs and always change their color without adding new Divs.</strong> </p>
  
  <p>Thanks alot!</p>
  
  <p>Taylor</p>