JSFiddle - React, Tailwind, and code Playground

HTML

<script src="//code.jquery.com/jquery-1.9.1.js"></script>
<h2>D3 in Object</h2>

<div id="holder"></div>
<p id="red">Red</p>
<p id="blue">Blue</p>

CSS

#red:hover, #blue:hover {cursor: pointer}

JavaScript

var Canvas = function(B, H){
	this.canvas = d3.select("#holder").append("svg:svg").attr("width",B).attr("height",H)
	        .style({'border':'5px solid black'});
	this.red = function(){this.canvas.style({'border':'5px solid red'});};
	this.blue = function(){this.canvas.style({'border':'5px solid blue'});};
}

var Canvas1 = new Canvas(200,70);

$("#red").click(function(){Canvas1.red();});
$("#blue").click(function(){Canvas1.blue()});