Question: I have a event listener on a parent div, and i'd like it not to get fired on child div onclick as well.

I'm using jQuery for this, since i need the .on() being the element dynamically created, also the child div is dynamically created with an inline onclick="myFunction()".
When the onclick myFunction occurs in the child i don't want the parent .on(click) gets called again.

html:

```
    <div id="parent" class="areatext" onkeydown="checkR()">
    <div id="input" contenteditable="true" style="min-height:26px;" onkeyup="checkTyping()"></div>
    <div id="child" onclick="myFunction()"></div>
    </div>

```

js file 1:

```
$('#parent').on('click', function(event){
    $('#input').focus();
    console.log('parent clicked!');
    event.stopPropagation();
});

```

js file 2:

```
function myFunction(event){
   // actions
   // when this is clicked, #parent .on(click) also triggers, i don't want that
}

```

Answer: 
You have to instantiate all the nested properties as well, they are null by default. Try this:

```
var mainFolder = new MainFolderDisplay
{
    SubFolderDisplay = new List<SubFolderDisplay>
    {
        new SubFolderDisplay
        {
            StorageFileDisplay = new List<StorageFileDisplay>
            {
                new StorageFileDisplay
                {
                    AwsUniqueFileName = "foo",
                    FileId = 0,
                    FolderType = 0,
                    RelatedFolderId = 0,
                    UserDisplayFileName = "foo",
                    UserId = 0,
                }
            }
        }
    }
};

```
I think SubFolderDisplay or StorageFileDisplay lists are not instantiated. Ensure that before adding 

```
new List<SubFolderDisplay>()
new List<StorageFileDisplay>()

```