.js

//https://jsonplaceholder.typicode.com/todos/1

let container = document.getElementById("container")

function displayResult(result) {

    container.innerHTML =
    `<p>${result.title}</p>
      <p>${result.userId}</p>
    `
}

function performPOSTRequestUsingjQuery() {

  $.post("https://jsonplaceholder.typicode.com/posts",{
    title : 'foo',
    body : 'bar',
    userId : 100
  },function(data){
    console.log(data)
  })

}

//performPOSTRequestUsingjQuery()

function performRequestUsingjQuery() {

  $.get("https://jsonplaceholder.typicode.com/todos/1",function(data){
    console.log(data)
  })

}

//performRequestUsingjQuery()


function performRequest() {

  var request = new XMLHttpRequest()

  request.onerror = function(error) {
    console.log("onerror fired..")
    console.log(error)
  }

  request.onload = function() {

    console.log("onreadystatechange")
    console.log("ready state " + this.readyState)
    console.log("status " + this.status)

    console.log(this.responseText)

    if(this.readyState == 4 && this.status == 200) {

      let obj = JSON.parse(this.responseText)
      displayResult(obj)
    }
  }

  request.open("GET","https://reqres.in/api/users?page=2")
  //request.open("GET","https://jsonplaceholder.typicode.com/todos/1")
  request.send()

}

performRequest()