-2

In my score tracking app I'm trying to display the name (#firstPlacePlayer) and score (#firstPlaceScore) with the current leader as game goes on. I want to move only high scorer values of the h3 to my h2. My HTML: 

<h2><span id="firstPlacePlayer">Leader </span>has 
<span id="firstPlaceScore">0</span> points!</h2>

<h3><span class="p1Name">Ben</span>: <span id="p1Display">2</span> VPs</h3>
<h3><span class="p2Name">Dan</span>: <span id="p2Display">2</span> VPs</h3>

My javascript:

var p1Name = document.querySelector('p1Name');
var playerScores = [p1Score, p2Score]
var firstPlace = Math.max.apply(null, playerScores);

function changeLeader () {
    document.getElementById('firstPlaceScore').textContent = firstPlace;
};
Rory McCrossan
  • 331,213
  • 40
  • 305
  • 339
DGrex
  • 1
  • 2
  • 3
    It's not clear what you're asking here, your code seems to already be doing what you need. Also there's no jQuery involved, so I've removed that tag. – Rory McCrossan Dec 12 '16 at 07:53
  • Probably one of the values is not a number: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Math/max – Lain Dec 12 '16 at 07:55

1 Answers1

0

This is a jquery solution

var palyers = $("h3"),scores=[];
$.each(palyers, function(i,player){
  scores.push(parseInt($(player).find("SPAN:last")[0].textContent,10));
})
var firstPlace = Math.max.apply(null, scores);
changeLeader();
function changeLeader () {
    document.getElementById('firstPlaceScore').textContent = firstPlace;
};

here is a working plnkr http://plnkr.co/edit/cBHOuHyrHz1Gk7zzYVX8?p=preview

w.Bala
  • 129
  • 3