CODEWITHSUNDEEP
javascripthtmlcsscodepen
Nick Chand
Nick Chand

Reputation: 83

HTML div class conditional URL

I Forked an NBA 2K Random Team picker from another user and was tweaking it to my needs. I am stumped on something probably simple for one of you. Thanks in advance.

When the "Randomize" button is clicked, the team "name" and "logo" display. I added a "roster" url to display as well but I want that url to be clickable in to a new tab/window. I can't seem to figure it out.

https://codepen.io/nick-c/pen/dNwMaZ

Below is just the html. I couldn't manage to post all the script and css. 

    <div class='container'>
  <div class='title'>
    <img src='http://fluidesign.co.uk/wp content/uploads/2016/12/NBA_2K17_logo.png'/>
  </div>
  <div class='team home'>
    <h3>Home</h3>
    <div class='logo'></div>
    <div class='name'>?</div>
    <div class='roster'>Click for Rosters</div>
    <div class='random'>Randomize</div>
  </div>
  <div class='team away'>
    <h3>Away</h3>
    <div class='logo'></div>
    <div class='name'>?</div>
    <div class='random'>Randomize</div>
  </div>
  <div class='vs'>vs</div>
  <div class='clear'></div>
</div>

Upvotes: 0

Views: 797

Answers (2)

Admin Administrator Official
Admin Administrator Official

Reputation: 31

i think you want this

<a href="link-here" target="_blank">example</a>

Upvotes: 1

Sarah Gro&#223;
Sarah Gro&#223;

Reputation: 10879

You didn't "manage to post all the script and css"? Where's the difference in pasting it into a codepen or pasting it into the code snipped tool here on StackOverflow? Anyway...

You are currently just setting the link as a text in the line:

$(".home .roster").text(teams[index].roster);

But what you want to do is add it as a link:

$(".home .roster").html('<a href="' + teams[index].roster + '" class="divLink" target="_blank">Webpage URL</a>');

Easy, huh? ;) See a working fork of your codepen here: https://codepen.io/anon/pen/xgmEOm

Upvotes: 1

Related Questions