Multiple choice quiz jQuery plugin

Information about the interactive jQuery multiple choice questionnaire / quiz widget using Ajax to load an external XML file containing the questions and answers.

Try the quiz script on a live site

Installing the quiz in a web page on your site

Load the javascript file

<script type="text/javascript" src="/js/jquery.ui.quiz-xml-1.js"></script>

Add a DIV  with a unique ID to display the quiz contents

<div id="myDiv">Your  multiple choice quiz is loading…</div>

Call the jQuery

<script>// <![CDATA[
$(function () {
$( "#myDiv" ).quiz21( { url:"quiz-geography-2.xml" } )
// ]]></script>


url : the url of the XML file containing the Quiz data

The XML quiz file format

<?xml version="1.0" encoding="UTF-8"?>
<Title>My Quiz title</Title>
<Description>A description about My Quiz</Description>
<Title>Which city is furthest north</Title>

The Questions

How to format a single question and the corresponding choices in the XML file:

 <?xml version="1.0" encoding="UTF-8"?>
 <Title>My Quiz title </Title>
 <Description>A description about My Quiz </Description>
 <Title>Which city is furthest north </Title>
 <Choice>Paris </Choice>
 <Choice>Lyon </Choice>
 <Choice>Grenoble </Choice>
 <Title>... </Title>
 <Choice>... </Choice>
 <Choice>... </Choice>

<Title> tag is the text of the question to be displayed.
The first <Choice> is always the correct answer but all the <Choice>s will be displayed in a random order.

A quiz can contain as many questions as is needed.
A question can have as many choices as is needed, but try to limit this with regards to the users view port.


jquery quiz

Styling is very simple and you can change the appearance over each HTML tag, simply override the elements in the DIV wich contains the widget, for example:

<style type="text/css" media="screen">
margin:20px auto;
border:1px solid #aaa;
#myDiv input[type=radio]{


The mimified  javascript file is 2.24k bytes and is compatible  with jQuery UI 1.10 +. The display remains responsive if the containing div is not set to a fixed size.

Contact us if you have questions or need more details on installing or using the widget. We can provide you with custom installations upon request.

Need help installing?

If you prefer using our expertise to install a quiz on your site, contact us. You’ll save time and money.

We have a dedicated editing and management interface with a database connection for larger scale deliveries of the quiz. This includes restricted user access and recording of user scores.

Contact us for more information .

More possibilities

  • Add an option to shuffle or not shuffle the questions, at the moment the questions are shuffled.
  • Add different point values  for correct or incorrect answers.
  • Add an option to display or not display the final score at the end of the quiz.

Other ways to contact us