How to use jqPlot?

I am importing jqPlot in my project as follows:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>Insert title here</title>
    <script language="javascript" type="text/javascript" src="../js/jqplot/jquery.min.js"></script>
    <script language="javascript" type="text/javascript" src="../js/jqplot/jquery.jqplot.min.js"></script>
    <link rel="stylesheet" type="text/css" href="../js/jqplot/jquery.jqplot.css" />
    <script type="text/javascript">
      $.jqplot('chartdiv', [[[1, 2],[3,5.12],[5,13.1],[7,33.6],[9,85.9],[11,219.9]]]);
    </script>
  </head>
  <body>
    <div id="chartdiv" style="height:400px;width:300px; "></div>
  </body>
</html>

I opened this html page in Chrome, but there is an error message:

$.jqplot('chartdiv', [[[1, 2],[3,5.12],[5,13.1],[7,33.6],[9,85.9],[11,219.9]]]);
Uncaught TypeError: Cannot call method 'jqplot' of undefined "

I don't exactly know the reason.

Solution

jqplot throws an exception:

Uncaught No plot target specified

This means that it cannot find where you want to place the chart because the DOM is not ready. You can fix it by wrapping the call to jqplot within the jQuery function

$(function(){
    $.jqplot('chartdiv', [[[1, 2],[3,5.12],[5,13.1],[7,33.6],[9,85.9],[11,219.9]]]);
});

Example: http://jsfiddle.net/jaimem/6ds84/