<div class="recruitTitle">Recruitment Needs</div>
<div class="recruitTalent"></div>
<!-- add a space and another recruit box -->
<br>
<div class="recruitTalent"></div>

<link rel="stylesheet" href="http://www.axiomfiles.com/Files/258012/wowtalents.css" type="text/css" />
<script src="http://www.axiomfiles.com/Files/258012/wowtalents.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function(){
  $('.recruitTalent:first').wowTalents();
  $('.recruitTalent:last').wowTalents(); // point to the last/second recruit box
})
</script>

$(document).ready(function(){
  $('.recruitTalent:first').wowTalents(options);
  $('.recruitTalent:last').wowTalents(options); // point to the last/second recruit box
})

<link rel="stylesheet" href="http://www.axiomfiles.com/Files/258012/wowtalents.css" type="text/css" />
<style type="text/css">
 /* overall box style */
 .recruitTitle { text-align: center; font-size:130%; }
 #recruitTalent { margin: 0 auto; width: 250px; }
 /* color used in tooltips (works for text and background) */
 .high { color: #0f0; }
 .medium { color: #ff0; }
 .low { color: #f00; }
 .none { color: #999; }
 /* text color when colorBackground is true */
 .usebg { color: #fff; }
 /* opacity used on images */
 img.high { opacity: 1; filter: alpha(opacity=100); }
 img.medium { opacity: 1; filter: alpha(opacity=100); }
 img.low { opacity: 1; filter: alpha(opacity=100); }
 img.none { opacity: .25; filter: alpha(opacity=25); }
 /* ".classIcon" contains the icon and text, ".classIcon span" only contains the class name text */
 .classIcon { width:25%; }
 .classIcon span { padding-left: 2px; }
 /* contains all 3 talent tree icons */
 .talentIcons { width: 25%; text-align: right; }
 .classIcon img, .talentIcons img { vertical-align: top; }
</style>

<div class="recruitTitle">PvP Recruitment</div>
<div class="recruitTalent"></div>

<div class="recruitTitle">WDR Recruitment</div>
<div class="recruitTalent"></div>

<script src="http://www.axiomfiles.com/Files/258012/wowtalents.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function(){
 // PvP Recruitment
 $('.recruitTalent:first').wowTalents({
  colorBackground: "false",
  defaultNeed: "None",
  deathknight : "H,x,x",
  druid : "x,H,x",
  hunter: "x,x,x",
  mage : "x,x,H",
  priest : "x,x,x",
  paladin : "H,x,x",
  rogue : "x,x,x",
  shaman : "x,x,H",
  warlock : "x,x,x",
  warrior : "m,m,m"
 });
 // WDR Recruitment
 $('.recruitTalent:last').wowTalents({
  colorBackground: "false",
  defaultNeed: "None",
  deathknight : "L,x,x",
  druid : "x,H,x",
  hunter: "x,x,x",
  mage : "x,m,x",
  priest : "m,m,x",
  paladin : "m,m,x",
  rogue : "x,x,x",
  shaman : "x,x,x",
  warlock : "l,l,l",
  warrior : "m,x,m"
 });
});
</script>