I have two columns in html with the following markup:
Column 1:
<div id="uni1Query">
<p id="uni1Query1Result" data-sgvizler-chart="sText" data-sgvizler-loglevel="2"><div><p>54.7</p></div></p>
<p id="uni1Query2Result" data-sgvizler-chart="sText" data-sgvizler-loglevel="2"><div><p>34.7</p></div></p>
</div>
Column 2:
<div id="uni2Query">
<p id="uni2Query1Result" data-sgvizler-chart="sText" data-sgvizler-loglevel="2"><div><p>54.7</p></div></p>
<p id="uni1Query2Result" data-sgvizler-chart="sText" data-sgvizler-loglevel="2"><div><p>34.7</p></div></p>
</div>
What I want to do is to get the values from column 1 and compare them to same value in column 2.
So what I want is to compare the value of uni1Query1Result with uni2Query1Result and uni2Query1Result with un21Query2Result and so on. I have a third column where the results should be.
What is the best way o do this?
I tried the following:
r1 = parseInt($("#uni1Query1Result p").val());
console.log(r1);
r2 = parseInt($("#uni2Query1Result p").val());
console.log(r2);
r3 = (r1 - r2);
alert(r3);
But that results in NaN.
You can not nest block level elements within a <p>
tag, browsers will close the parent <p>
tag. Checking your console in Chrome will show you that.
Also, you should use html()
to find the inner value of the tag, and parseFloat
to find a float number (not an integer)
parseFloat($("#uni1Query1Result p").html())