There is a similar type of construction:

<div class="col-4 productCard" id="pCard15"> <img class="image" src="ссылка"> <h1 class="titleText">123</h1> <p class="descriptionText">123</p> <p class="priceText">321$</p> <button class="btn btn-success changeProduct" id="changeProduct">Change Product</button>

How can I get out the value of h1? I do like this, but it does not come out:

 var prodName = $("#productCard" + id + " h1.titleText").text();
  • if you have pCard15 in id , then you get the selector by id="productCardpCard15" , but there is no such - Rostyslav Kuzmovych

3 answers 3

You have a typo, you search by id = #productCard , whereas you have id = pCard15`

 var id = 15; var prodName = $("#pCard" + id + " h1.titleText").text(); console.log(prodName); 
 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <div class="col-4 productCard" id="pCard15"> <img class="image" src="ссылка"> <h1 class="titleText">1243</h1> <p class="descriptionText">123</p> <p class="priceText">321$</p> <button class="btn btn-success changeProduct" id="changeProduct">Change Product</button>

    There are two ways to pull out the text in JS; the first is below.

    innerHTML

    Second

    textContent

    Also three ways in jQuery

    1. .text ();

    2. .contents ();

    3. .html ();

    An example of pure javascript

     let titleText = document.querySelector(".titleText").innerHTML; console.log(titleText); let priceText = document.querySelector(".priceText").textContent; console.log(priceText); 
     <div class="col-4 productCard" id="pCard15"> <img class="image" src="ссылка"> <h1 class="titleText">123</h1> <p class="descriptionText">123</p> <p class="priceText">321$</p> <button class="btn btn-success changeProduct" id="changeProduct">Change Product</button>

      Instead

       var prodName = $("#productCard" + id + " h1.titleText").text();

      insert

       var prodName = $("#pCard" + id + " h1.titleText").text();