Cloned content editable div not retaining keydown event
<p>I'm very new to Jquery and looking to solve the reason a keydown event on a content editable div isn't cloning. I thought I had solved things when I discovered clone(true), but no my code still isn't working. The code below is a simplified version of what I'm trying to achieve. </p>

<p>Basically I'm attaching a keydown event to a content editable div then cloning it. However the cloned div isn't working like the original div.  </p>

<p>I've been searching for a solution for a good while now and was hope someone could give me an answer so I can move on - many thanks.</p>

<pre><code>&lt;!DOCTYPE HTML&gt;
&lt;html&gt;
&lt;head&gt;
&lt;meta charset="UTF-8"&gt;
&lt;title&gt;untitled&lt;/title&gt;

&lt;script src="http://code.jquery.com/jquery-1.9.1.min.js"&gt;&lt;/script&gt;
&lt;script type="text/javascript"&gt;


$(document).ready(function() {

    var mymax1 = 10;

    $('#List_1').keydown(function(e){ check_charcount(mymax1, e); });

    function check_charcount(mymax1, e)
    {   
        &lt;!--prevent line breaks, that is the enter key from working--&gt;
        if(e.keyCode==13){
        e.preventDefault();
        }

        if(e.which != 8 &amp;&amp; $('#List_1').text().length &gt; mymax1{
            $("#List_1").css("background-color","yellow"); 

            e.preventDefault();
        }
    }

    &lt;!----&gt;
    var $cloned = $('#hope').clone(true);

    $('#placeHere').append($cloned.html());
    });

&lt;/script&gt;

&lt;/head&gt;
&lt;body&gt;

&lt;div id="hope"&gt;
&lt;div id="List_1"  contentEditable="true"&gt;TEXT&lt;/div&gt;
&lt;/div&gt;

&lt;/br&gt;
&lt;div id="placeHere"&gt;&lt;/div&gt;
&lt;/body&gt;
&lt;/html&gt;
</code></pre>
