I am familiar with the persistent and non-persistent XSS. I also know about Same origin policy that prevents/restricts requests originating from one websites page to go to anoth
SOP typically cannot prevent either XSS or CSRF.
For XSS, jakber's answer already provides a good explanation. I just want to add that the reason to call this vulnerability "cross-site" is because the attacker can inject code (e.g. ) into the target page that loads malicious javascript from another website, which is typically controlled by the attacker. Loading Javascript from another website is not denied by SOP, because doing that will break the Web.
For CSRF, SOP cannot prevent it for most cases because SOP does not prevent website A to send GET and POST requests to website B.