dont remove if focus

I'm trying to build by own function which can set the data of a textbox by showing a div which has the options and allowing the user to click on it to set it. Ive soo far done:-

And it works fine to the point of showing the div however the user cannot select the 'hello' div to set it.

Im a bit stuck on how to keep the div showing but remove it if the user selects something else. Im trying to replicate other widgets like the datepicker and auto-suggest jQuery UI widgets, but mine has some requirements, so wanted to build from scratch.

Anyone got any suggestions on how I can accomplish this?

Thank you
Who is Participating?

[Product update] Infrastructure Analysis Tool is now available with Business Accounts.Learn More

I wear a lot of hats...

"The solutions and answers provided on Experts Exchange have been extremely helpful to me over the last few years. I wear a lot of hats - Developer, Database Administrator, Help Desk, etc., so I know a lot of things but not a lot about one thing. Experts Exchange gives me answers from people who do know a lot about one thing, in a easy to use platform." -Todd S.

Tom BeckCommented:
Struggling to follow your logic here. You are creating a div with the word "Hello" in it whenever one of the two text boxes has focus then removing the div whenever the text boxes lose focus. The click event on the created div never fires because the div is removed from the DOM as soon as you click on it (because the text box loses focus).

Is there a reason you need to create the divs dynamically rather then just have them hidden on the page?

Is there any reason not to give each textbook or div a common class so you can simply create event handlers for those classes? It would avoid looping over the text boxes (which doesn't make sense either since you are calling the function for each one separately anyway.)

This update of your fiddle is still fairly useless, but it demonstrates my questions to you.
tonelm54Author Commented:
Sorry, what Im trying to do is create an auto-complete box, which works the same as jQuery UI's but slightly different. What Ive got a problem with at the moment is the auto-complete box disappears when the textbox looses focus (which is correct), but if the mouse is in the auto-complete box then I don't want it to disappear.
Tom BeckCommented:
I thought I demonstrated how to do that with the jsfiddle I posted.

Anyway, here's an update to that fiddle with a little more functionality.

Experts Exchange Solution brought to you by

Your issues matter to us.

Facing a tech roadblock? Get the help and guidance you need from experienced professionals who care. Ask your question anytime, anywhere, with no hassle.

Start your 7-day free trial
It's more than this solution.Get answers and train to solve all your tech problems - anytime, anywhere.Try it for free Edge Out The Competitionfor your dream job with proven skills and certifications.Get started today Stand Outas the employee with proven skills.Start learning today for free Move Your Career Forwardwith certification training in the latest technologies.Start your trial today

From novice to tech pro — start learning today.