Clicking input field triggers jQuery function
<p>I'm trying to create a selectable list that when you click on an item, it displays an input field that you can use to edit the description but until the item is clicked on, the input field is hidden. </p>

<p>However, when I select an item and then click on the input field, it unselects the item and the input field is hidden again.</p>

<p>I've recreated the issue <a href="https://jsbin.com/dekuka/edit?html,css,js,output" rel="nofollow">here</a> with just one list item. How can I allow for the user to click in the input field without triggering the jQuery function?</p>

<p>Also, the user will be able to click multiple items in the list so I've updated the jsbin with a second item.</p>