<!DOCTYPE html>
<html>

<head>
  <meta charset="utf-8" />
  <title></title>
  <link rel="stylesheet" href="style.css" />
  <script data-require="jquery" data-semver="3.1.1" src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
  <script>
    var users = [{
      id: 1,
      name: "Anil SIngh"
    }, {
      id: 2,
      name: "Alok"
    }, {
      id: 3,
      name: "Dilip"
    }, {
      id: 4,
      name: "Aradhya"
    }];


    var questions = [{
      id: 1,
      text: "70%",
      ques_user_id: 2
    }, {
      id: 2,
      text: "71%",
      ques_user_id: 2
    }, {
      id: 3,
      text: "58%",
      ques_user_id: 1
    }, {
      id: 4,
      text: "68%",
      ques_user_id: 2
    }, {
      id: 5,
      text: "82%",
      ques_user_id: 3
    }, {
      id: 6,
      text: "55%",
      ques_user_id: 3
    }];

    var joins = innerJoin(users, questions, function(user, question) {
      if (question.ques_user_id === user.id) {
        return {
          id: question.id,
          text: question.text,
          name: user.name
        };
      }
    });

    function innerJoin(a, b, select) {
      var m = a.length,
        n = b.length,
        c = [];

      for (var i = 0; i < m; i++) {
        var x = a[i];

        for (var j = 0; j < n; j++) { // cartesian product - all combinations
          var y = select(x, b[j]); // filter out the rows and columns you want
          if (y) c.push(y); // if a row is returned add it to the table
        }
      }

      return c;
    }

    alert(JSON.stringify(joins));
  </script>
</head>

<body>
  <h1>How to join two objects in javascript?</h1>
   <p><a href="http://www.code-sample.com">For more...</a></p>
  <!-- Put your html here! -->
</body>

</html>
/* Put your css in here */

h1 {
  color: red;
}