JAVASCRIPT

Hello, I am trying to work on a project which requires me not allow a user to click outside of a particular element, let's say a "<div>" or "<p>", then how can I detect click outside an element using Javascript?

Figure i am talking about-:

https://imgur.com/a/T4viIKF

Confusions, "ie" means my interpretation that i am not sure if is correct or not)-:

1) user clicks invoking an event handler.

  i.e when an user event occurs, it makes a javascript call. most likely user event=function call

2) handler's code creates xmlhttprequest object

  i.e that javascript call creates xmlhttprequest in ajax engine.

3) xhr requests file from server

4) server sends the file.

5) NOW I AM CONFUSED.

the terminologies are confusing me. 

like-:

1. a) xhr fires an event. what does that mean? and why to fire an event? Doesn’t user only fire event? Like clicking,pressing some key etc.
2. b) you can attach handler function to event. (maybe it is trying to talk about event handler i.e if event->handlerfunction() )..I am not sure. 

handler fxn then processes the data and displays it.